:root{color:#222;font-synthesis:none;text-rendering:optimizelegibility;background-color:#f5f5f5;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}body{min-height:100vh;margin:0}button{color:#222;cursor:pointer;background-color:#fff;border:1px solid #888;border-radius:6px;padding:.5em 1em;font-family:inherit;font-size:1em}button:disabled{opacity:.5;cursor:default}.app{--header-height:3.25rem;--footer-height:7.75rem;--stage-height:calc(100dvh - var(--header-height) - var(--footer-height));box-sizing:border-box;color:#1f2933;background:#fff;height:100dvh;min-height:100dvh;padding:0;position:relative;overflow:hidden}.app h1{z-index:5;height:var(--header-height);text-align:center;letter-spacing:.24em;text-transform:uppercase;justify-content:center;align-items:center;margin:0;font-size:clamp(1.45rem,8vw,2.15rem);font-weight:200;line-height:1;display:flex;position:absolute;top:0;left:0;right:0}.layout{top:var(--header-height);right:0;bottom:var(--footer-height);box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;min-height:0;padding:3px 3px 9px;display:flex;position:absolute;left:0;overflow:hidden}.board{width:min(calc((var(--stage-height) - 12px) * 7 / 12), calc(100vw - 6px));aspect-ratio:7/12;flex:none;max-width:100%;max-height:100%;position:relative;overflow:visible}.board__backdrop{gap:3px;height:100%;display:grid}.board__tiles{pointer-events:none;position:absolute;inset:0}.cell{cursor:pointer;background:0 0;border:1px solid #eee;border-radius:4px}.tile{color:#222;cursor:pointer;pointer-events:auto;background:#fff;border:1px solid #aaa;border-radius:6px;padding:0;font-size:1rem;font-weight:600;position:absolute;top:0;left:0}.tile--selected{color:#fff;background:#4f86ff;border-color:#4f86ff}.tile--clash{color:#fff;background:#e55252;border-color:#c73737}.board__tetromino{pointer-events:none;position:absolute;inset:0}.tetromino-tile{color:#123456;cursor:pointer;pointer-events:auto;background:#62a9f29e;border:1px solid #3f7fbf;border-radius:6px;padding:0;font-size:1rem;font-weight:700;position:absolute;top:0;left:0}.tetromino-tile--clash{color:#fff;background:#ee5757bd;border-color:#c73737}.tile__order{opacity:.85;font-size:.55rem;font-weight:400;position:absolute;top:1px;right:2px}.controls{z-index:10;box-sizing:border-box;height:var(--footer-height);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#eee;flex-direction:column;justify-content:center;align-items:center;gap:.35rem;display:flex;position:absolute;bottom:0;left:0;right:0}.current-word{letter-spacing:.1em;text-align:center;text-overflow:ellipsis;white-space:nowrap;max-width:min(328px,100vw - 2rem);font-size:.95rem;font-weight:500;line-height:1.25;overflow:hidden}.current-word__score{color:#4f86ff;font-weight:400}.controls__actions{grid-template-columns:minmax(4.75rem,1fr) 5.25rem minmax(4.75rem,1fr);place-items:center;gap:.65rem;width:min(328px,100vw - 2rem);display:grid}.controls__button,.controls__text-button{font:inherit;cursor:pointer;border:0}.controls__button:disabled,.controls__text-button:disabled{cursor:default;opacity:.38}.controls__stack{flex-direction:column;align-items:center;gap:.28rem;min-width:0;display:flex}.controls__button--submit{color:#fff;letter-spacing:.08em;text-transform:uppercase;background:#1f2933;border-radius:999px;width:5.25rem;height:5.25rem;font-size:.82rem;font-weight:700;box-shadow:0 12px 24px #1f293338}.controls__button--secondary{color:#52606d;letter-spacing:.08em;text-transform:uppercase;background:#edf1f5;border-radius:999px;min-width:4.55rem;padding:.55rem .65rem;font-size:.7rem;font-weight:700}.controls__text-button{color:#7b8794;letter-spacing:.06em;text-transform:uppercase;background:0 0;min-height:1.45rem;padding:.2rem .25rem;font-size:.63rem;line-height:1.1}.controls__score-button{color:#4f86ff;font-weight:700}.message{color:#c0392b;text-align:center;font-size:.75rem;line-height:1.2}.status{color:#555}.status--error{color:#c0392b}.word-list{max-height:55vh;margin:0;padding:0;list-style:none;overflow-y:auto}.word-list__points{color:#4f86ff}.score-modal{z-index:20;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.score-modal__backdrop{background:#1f293359;border:0;border-radius:0;padding:0;position:absolute;inset:0}.score-modal__panel{box-sizing:border-box;background:#fff;border-radius:8px;width:min(24rem,100vw - 2rem);max-height:min(28rem,100dvh - 6rem);margin:1rem;padding:1rem;position:relative;overflow:hidden;box-shadow:0 22px 60px #1f293347}.score-modal__header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.75rem;display:flex}.score-modal__header h2{margin:0;font-size:1.1rem;font-weight:700}.score-modal__close{color:#52606d;letter-spacing:.08em;text-transform:uppercase;background:0 0;border:0;font-size:.72rem;font-weight:700}.score-modal__empty{color:#7b8794;margin:0}@media (height<=760px){.controls{gap:.3rem;padding-top:.4rem}.controls__button--submit{width:4.75rem;height:4.75rem}.controls__actions{grid-template-columns:minmax(4.25rem,1fr) 4.75rem minmax(4.25rem,1fr)}}@media (width>=720px){.app{--header-height:3.75rem}.layout{justify-content:center}}@media (prefers-color-scheme:dark){.app{color:#e5eaf0;background:#101418}.cell{border-color:#28323d}.tile{color:#f5f7fa;background:#1f2933;border-color:#52606d}.tile--selected{color:#07111f;background:#5f96ff;border-color:#8cb6ff}.tile--clash{color:#fff;background:#b94444;border-color:#f28b82}.tetromino-tile{color:#eaf4ff;background:#70b2ff80;border-color:#86bfff}.tetromino-tile--clash{color:#fff;background:#da5454b8;border-color:#ff9b9b}.controls{background:#171d24}.current-word__score,.controls__score-button,.word-list__points{color:#86bfff}.controls__button--submit{color:#101418;background:#f5f7fa;box-shadow:0 12px 24px #00000057}.controls__button--secondary{color:#cbd5df;background:#28323d}.controls__text-button{color:#9aa5b1}.message,.status--error{color:#ff9b9b}.status{color:#9aa5b1}.score-modal__backdrop{background:#00000094}.score-modal__panel{color:#e5eaf0;background:#171d24;box-shadow:0 22px 60px #00000085}.score-modal__close{color:#cbd5df}.score-modal__empty{color:#9aa5b1}}