.reflection-dialog{--paper:#fff;--ink:#101010;--muted:#555;--rule:#aaa;background:var(--paper);color:var(--ink);border:1px solid var(--ink);width:min(920px,calc(100vw - 28px));max-width:none;height:min(860px,calc(100dvh - 36px));max-height:none;padding:9px;overflow:hidden;box-shadow:0 24px 110px #0008;-webkit-tap-highlight-color:transparent}
.reflection-dialog[data-tone=dark]{--paper:#0b0b0b;--ink:#fff;--muted:#c1c1c1;--rule:#666}
.reflection-dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}
.reflection-shell{height:100%;display:flex;flex-direction:column;border:1px solid var(--rule);min-height:0}
.reflection-shell header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 25px;border-bottom:1px solid var(--rule);flex:none}
.reflection-brand{display:flex;align-items:center;gap:20px;font:700 15px 'Courier New',monospace;letter-spacing:3px;white-space:nowrap}
.reflection-brand img{width:23px;height:29px;object-fit:contain;filter:brightness(0)}
.reflection-dialog[data-tone=dark] .reflection-brand img{filter:brightness(0) invert(1)}
.reflection-dialog button,.reflection-dialog select{color:var(--ink);background:var(--paper);border:1px solid var(--rule);padding:10px 14px;min-height:44px;font:700 13px 'Courier New',monospace;cursor:pointer}
.reflection-dialog button:hover,.reflection-dialog button[aria-pressed=true]{color:var(--paper);background:var(--ink)}
.reflection-dialog :focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.reflection-content{overflow-y:auto;overscroll-behavior:contain;padding:28px 64px 24px;min-height:0;text-align:center;scrollbar-gutter:stable;background:var(--paper);isolation:isolate}
.reflection-kicker{font:700 10px 'Courier New',monospace;letter-spacing:2px;color:var(--muted);margin:0 0 15px}
.reflection-ornament{font-size:29px;margin-bottom:18px}
.reflection-theme{font:700 12px 'Courier New',monospace;letter-spacing:3px;text-transform:uppercase;margin:0 0 10px}
.reflection-content h2{font:400 clamp(25px,3vw,38px)/1.14 Georgia,serif;letter-spacing:-.4px;margin:0 0 24px}
.reflection-content blockquote{font:400 clamp(21px,2.5vw,29px)/1.48 Georgia,serif;margin:0;text-wrap:pretty}
.reflection-credit{font:700 10px 'Courier New',monospace;letter-spacing:2px;margin:24px 0 30px;text-transform:uppercase}
.reflection-question{text-align:left;border-left:2px solid var(--ink);padding:3px 0 3px 20px;color:var(--muted)}
.reflection-question span{font:700 10px 'Courier New',monospace;letter-spacing:1px}
.reflection-question p{font:italic 17px/1.55 Georgia,serif;margin:9px 0 0}
.reflection-source,.reflection-collection{text-align:left;border-top:1px solid var(--rule);padding:15px 0;font:12px/1.6 'Courier New',monospace}
.reflection-source{margin-top:28px;color:var(--muted)}
.reflection-dialog summary{cursor:pointer;min-height:30px;align-content:center}
.reflection-source p{margin:10px 0}.reflection-source a{text-decoration:underline}
.reflection-links{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:center;margin-top:10px}.reflection-links a{display:inline-flex;align-items:center;min-height:44px;font-weight:bold;text-underline-offset:4px}.reflection-source{text-align:center}.reflection-dialog button:disabled{opacity:.35;cursor:default}.reflection-dialog button:disabled:hover{color:var(--ink);background:var(--paper)}
.journal-book-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 18px;margin-top:12px}.journal-book-links a{display:inline-flex;align-items:center;min-height:44px;font:11px/1.4 Courier,monospace;text-decoration:underline;text-underline-offset:4px}
.reflection-collection label{display:flex;align-items:center;gap:12px;margin:14px 0}
.reflection-collection select{min-width:0;max-width:100%}
[data-collection]{display:grid;grid-template-columns:1fr 1fr;gap:8px}
[data-collection] button{text-align:left}
.reflection-preference{display:flex;gap:10px;align-items:center;text-align:left;font:12px/1.5 'Courier New',monospace;padding:14px 0;border-top:1px solid var(--rule)}
.reflection-preference input{accent-color:var(--ink);width:18px;height:18px;flex:none}
.reflection-storage{font:11px/1.5 'Courier New',monospace;color:var(--muted);text-align:left;margin:0}
.reflection-shell footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;width:100%;max-width:none;margin:0;padding:14px 25px;border-top:1px solid var(--rule);color:var(--ink);background:var(--paper);font:13px 'Courier New',monospace}.reflection-shell footer>span{display:block;color:var(--muted);font:12px 'Courier New',monospace}
.reflection-teaser{max-width:1320px;margin:0 auto 50px;padding:28px 36px;border:1px solid #111;background:#fff;color:#111;display:flex;justify-content:space-between;align-items:center;gap:22px}
.reflection-teaser span{font:700 11px 'Courier New',monospace;letter-spacing:2px}.reflection-teaser h2{font:400 clamp(25px,3vw,36px)/1.2 Georgia,serif;margin:10px 0}.reflection-teaser p{font:13px/1.6 'Courier New',monospace;margin:0;color:#555;max-width:600px}
.reflection-teaser button{background:#111;color:#fff;border:0;padding:17px 22px;font:700 13px 'Courier New',monospace;min-height:48px;flex:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.reflection-open{border:1px solid currentColor!important;padding:12px 15px!important;min-height:44px;background:transparent!important;color:inherit!important;font:700 12px 'Courier New',monospace!important;margin-top:16px;cursor:pointer;-webkit-tap-highlight-color:transparent}
@media(max-height:500px){.reflection-shell header{padding:8px 14px}.reflection-content{padding:15px 26px}.reflection-kicker,.reflection-ornament{display:none}.reflection-content h2{font-size:25px;margin-bottom:12px}.reflection-theme{font-size:10px;margin-bottom:6px}.reflection-content blockquote{font-size:20px;line-height:1.4}.reflection-credit{margin:16px 0}.reflection-shell footer{padding:8px 14px}.reflection-brand{font-size:12px;gap:14px}}
.overlay[data-mode=won] .overlay-inner,.overlay[data-mode=lost] .overlay-inner{display:flex;flex-direction:column;max-height:100%;min-height:0}.overlay[data-mode=won] #overlay-extra,.overlay[data-mode=lost] #overlay-extra{overflow-y:auto;min-height:0;overscroll-behavior:contain}.overlay[data-mode=won] #start-btn,.overlay[data-mode=won] #secondary-btn{flex:none}
#result-reading-btn{flex:none;display:block;text-align:left;margin:12px 0 10px;min-height:44px}
.overlay:is([data-mode=won],[data-mode=lost]) :is(#start-btn,#secondary-btn){min-height:44px}
@media(orientation:landscape) and (max-height:500px){.overlay:is([data-mode=won],[data-mode=lost]) :is(#overlay-copy,#overlay-eyebrow){display:none}}
@media(max-width:640px){.reflection-dialog{width:calc(100vw - 16px);height:calc(100dvh - 16px);padding:5px}.reflection-shell header{padding:12px;gap:7px}.reflection-brand{font-size:11px;letter-spacing:1px;gap:9px}.reflection-brand img{width:16px;height:23px}.reflection-dialog button{padding:10px;font-size:11px}.reflection-content{padding:25px 20px}.reflection-content blockquote{font-size:22px}.reflection-content h2{font-size:27px}.reflection-shell footer{padding:12px}.reflection-question p{font-size:16px}[data-collection]{grid-template-columns:1fr}.reflection-teaser{margin:0 12px 32px;padding:24px;flex-direction:column;align-items:flex-start}.reflection-teaser button{width:100%}}