/* Let the website's blue sky continue through the animation, without a card edge. */
:root{color:#f4f7ff;background:transparent;--ink:#f4f7ff;--accent:#9ee8df}
html,body{background:transparent}
.masthead,.promo:after,.timeline{display:none}
.promo{padding:24px 5vw 0;min-height:100svh;background:transparent}
.composition{margin:auto}
.eyebrow{color:#b9ccec}
.word{color:#f4f7ff}.word-write{color:#a0e7dc}
[data-phase="ready"] .word-speak,[data-phase="ready"] .word-write,[data-phase="listening"] .word-write,[data-phase="stop"] .word-write,[data-phase="cleanup"] .word-write{opacity:.38}
.editor{background:linear-gradient(145deg,#172b50ee,#0c1933f5);border:1px solid #bfd6ff2b;box-shadow:0 25px 55px -25px #02091f80,inset 0 1px 0 #ffffff0b;text-align:left}
[data-phase="done"] .editor{box-shadow:0 25px 55px -25px #02091f80,inset 0 1px 0 #ffffff0b}
.editor-top{color:#aebed8;border-bottom-color:#c4d9ff17}.editor-top svg{stroke:#aebed8}
.lights i{background:#a6b8d249}.lights i:first-child{background:#ef8b86}.lights i:nth-child(2){background:#e6c580}.lights i:nth-child(3){background:#82b99c}
.note-label{color:#95a9c8}.note-title{color:#f0f4fc;font-weight:550}.note-body{color:#d9e4f5}.paper-lines i{background:linear-gradient(90deg,#aec7ea20,transparent)}
.editor-foot{color:#91a6c7}.saved svg{stroke:#91d4be}.note-dot{background:#a1b9de50}.caret{background:#a8ceff}
.bottom{min-height:64px;padding-bottom:18px}.signature{color:#b1c3e0}
button{color:#d5e2f6;background:#bed9ff0c;border-color:#bfd6ff29}button:hover{background:#bfd6ff22}button:focus-visible{outline-color:#a0e7dc}
.key-hint{right:0}.key-hint kbd{color:#d7e4f5;background:#14284b;border-color:#abc7ef45;box-shadow:0 3px 0 #07142d,0 5px 8px #050f2030}.key-label{color:#adc2e1}.key-pressed .key-hint kbd{background:#294472;box-shadow:none}
@media(max-width:760px){.promo{padding:24px 3vw 0}.bottom{min-height:72px;padding-bottom:24px}.signature{max-width:42%}.key-hint{right:50%}.paper{padding:22px 20px 14px}.stage{margin-top:24px}}
/* Match the host's supported schemes so the iframe canvas stays transparent. */
:root{color-scheme:light dark}
