*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#000;font-family:Arial,Helvetica,sans-serif;color:#fff}body{min-height:100vh;overflow:hidden}#app{position:relative;width:100%;height:100vh;height:100dvh;overflow:hidden;background:#000}.game-screen{position:absolute;top:0;left:0;width:580px;min-width:580px;aspect-ratio:580 / 1030;background:#000;padding:18px 18px 24px;overflow:visible;transform-origin:top left}.top-area{position:relative;display:flex;align-items:flex-start;justify-content:center;min-height:198px}.round-icon{position:absolute;top:30px;width:58px;height:58px;border-radius:50%;border:2px solid white;background:#00000038;color:#fff;font-size:34px;cursor:pointer}.menu-button{left:10px}.help-button{right:10px;font-weight:700}.logo-area{width:72%;text-align:center;padding-top:0}.letterstrings-logo{display:block;width:384px;max-width:100%;height:auto;margin:0 auto}.divider{height:1px;background:#58bcffb3;margin:0 0 10px}.round-header{position:relative;min-height:64px;display:flex;align-items:center;transform:translateY(-6px)}.timer{display:flex;align-items:center;gap:12px;font-size:46px;font-weight:800}.timer-icon{font-size:54px}.position{position:absolute;left:50%;transform:translate(-50%);color:#ffd21b;font-size:40px;font-weight:900}.start-button{position:absolute;right:0;width:130px;height:64px;background:linear-gradient(#ffd538,#ffb90d);color:#050505;border:1px solid #fff0a8;border-radius:8px;font-size:24px;font-weight:800;cursor:pointer}.round-done-button{position:absolute;right:0;width:130px;height:64px;background:linear-gradient(#ffd538,#ffb90d);color:#050505;border:1px solid #fff0a8;border-radius:8px;font-size:24px;font-weight:800;cursor:pointer;display:none}.board{border-top:1px solid rgba(71,172,230,.72);padding:30px 2px 10px 10px}.game-row{display:grid;grid-template-columns:78px minmax(220px,1fr) 50px 50px 50px;gap:8px;align-items:center;margin-bottom:12px;transform:translateY(0)}.game-row:last-child{margin-bottom:0}.string-badge{width:85px;height:62px;justify-self:end;margin-right:4px;border-radius:50%;background:#000;border:4px solid #ffffff;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:900;letter-spacing:1px;box-shadow:0 3px 8px #0000008c}.answer-box{min-height:62px;height:62px;background:linear-gradient(180deg,#fff,#eee);color:#111;border-radius:10px;border:4px solid transparent;padding:8px 14px;font-size:36px;font-weight:900;letter-spacing:1px;text-align:center}.answer-box.green{border-color:#0bdd19;box-shadow:0 0 0 3px #0aa114cc,inset 0 0 8px #00000014}.action-button{width:50px;height:62px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#1b1b1b,#050505);color:#fff;border:1px solid #efefef;border-radius:8px;font-size:30px;font-weight:900;cursor:pointer;box-shadow:0 3px 7px #000000a6}.action-button svg{width:44px;height:44px;display:block;margin:auto;fill:#fff;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.no-word-button svg{fill:none}.show-button svg{fill:#fff}.show-button svg path{fill:#fff;stroke:#fff}.keyboard{display:none;margin-top:20px;padding:0 8px}.keyboard-row{display:flex;justify-content:center;gap:6px;margin-bottom:8px}.keyboard-row:last-child{margin-bottom:0}.key{width:48px;height:70px;box-sizing:border-box;padding:0;border:1px solid #ffffff;border-radius:7px;background:linear-gradient(180deg,#2a2a2a,#080808);color:#fff;font-size:28px;font-weight:800;cursor:pointer;touch-action:manipulation;user-select:none;-webkit-user-select:none}.backspace-key{width:64px;font-size:28px}.answer-box.active{position:relative}.answer-box.active:after{content:"";width:3px;height:32px;background:#111;margin-left:4px;animation:cursor-blink .9s steps(1) infinite}@keyframes cursor-blink{50%{opacity:0}}.score-area{display:grid;grid-template-columns:1fr 1px 1fr;align-items:center;gap:26px;margin:22px 28px 18px}.score-block{text-align:center}.score-label{font-size:22px;font-weight:800}.score-number{color:#ffd21b;font-size:44px;font-weight:900;margin-top:6px}.score-separator{width:1px;height:72px;background:#ffffffb3;transform:translateY(30px)}.score-block:first-child{transform:translate(-15px,30px)}.score-block:last-child{transform:translate(10px,30px)}.bottom-buttons{display:grid;width:auto;margin:0 28px 20px;padding:0;grid-template-columns:1fr 1fr;gap:26px;transform:translate(55px,135px)}.next-round-button,.done-button{width:70%;min-height:76px;border-radius:10px;font-size:28px;font-weight:900;cursor:pointer}.next-round-button{background:linear-gradient(#ffd538,#ffb90d);border:1px solid #fff0a8;color:#050505;transform:translateY(-100px)}.done-button{background:transparent;border:2px solid white;color:#fff;transform:translateY(-100px)}.play-message{height:30px;border-bottom:1px solid rgba(71,172,230,.72);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;text-align:center;color:#ffd21b}.home-state .position{visibility:hidden}.home-state .keyboard{display:none}.home-state .hidden-during-play{display:grid}.playing-state .menu-button,.playing-state .help-button,.playing-state .start-button{visibility:hidden}.playing-state .position{visibility:visible}.playing-state .hidden-during-play,.round-ended-state .keyboard{display:none}.round-ended-state .start-button{visibility:hidden}.round-ended-state .hidden-during-play{display:grid}.round-ended-state .done-button{visibility:none}.playing-state .keyboard{display:block}@media(max-width:99999px){.game-screen{padding:12px 8px 18px}}.no-word-button:disabled{background:#eee!important;opacity:1;cursor:default;pointer-events:none}.no-word-button:disabled svg{opacity:.75}.yellow-message{min-height:28px;width:100%;text-align:center;font-size:18px;font-weight:700;line-height:28px;color:#ff0;visibility:hidden}.yellow-message.visible{visibility:visible}.yellow-message .path-letter{font-size:24px;text-decoration:underline;text-underline-offset:3px}.ls-help-panel[hidden]{display:none!important}.ls-help-panel{position:fixed;inset:0;z-index:9999;background:#000000bf;display:flex;justify-content:center;align-items:center;padding:16px;box-sizing:border-box}.ls-help-content{background:#fffdf5;color:#222;width:100%;max-width:520px;max-height:85dvh;overflow-y:auto;padding:22px;border-radius:12px;box-sizing:border-box;font-family:Arial,sans-serif;font-size:16px;line-height:1.5}.ls-help-content h2{text-align:center;font-size:21px;margin:12px 0 24px}.ls-help-content h3{font-size:16px;margin:22px 0 8px;border-bottom:1px solid #ccc}.ls-help-content p{margin:8px 0}.ls-help-close{display:block;margin-left:auto;padding:10px 16px;border:0;border-radius:6px;background:#333;color:#fff;font-size:15px;cursor:pointer}.ls-help-link{display:block;width:100%;margin:10px 0 18px;padding:12px 14px;background:#e8edf5;color:#174477;border:1px solid #b8c9df;border-radius:7px;font-family:Arial,sans-serif;font-size:15px;font-weight:700;text-align:left;cursor:pointer}.ls-help-link:hover{background:#d6e3f3}.ls-help-back{display:block;width:100%;margin-top:24px;padding:12px;background:#333;color:#fff;border:none;border-radius:7px;font-family:Arial,sans-serif;font-size:15px;font-weight:700;cursor:pointer}.lock-button[hidden]{display:none!important}.answer-container{position:relative;min-width:0;width:100%}.answer-container .answer-box{width:100%;box-sizing:border-box}.answer-container .lock-button{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:34px;height:38px;padding:3px;background:transparent;border:none;box-shadow:none;color:#000;z-index:2}.answer-container .lock-button svg{width:28px;height:28px;fill:#000;stroke:#000}.answer-container .lock-button[hidden]{display:none!important}.answer-container:has(.lock-button:not([hidden])) .answer-box{font-size:28px;padding-right:42px}.home-state .bottom-buttons{display:none}.round-ended-state .bottom-buttons .done-button{transform:translate(-85px,-100px)}.round-ended-state .bottom-buttons{transform:translateY(135px);grid-template-columns:1fr 1px 1fr}.round-ended-state .bottom-buttons .done-button,.round-ended-state .bottom-buttons .next-round-button{grid-column:1;justify-self:center;transform:translate(-15px,-100px)}.round-ended-state .bottom-buttons .done-button{background:#009dff}.round-ended-state .bottom-buttons .comments-button{grid-column:3;justify-self:center;width:70%;min-height:76px;background:#009dff;color:#fff;border:2px solid white;border-radius:10px;font-size:24px;font-weight:900;cursor:pointer;transform:translate(10px,-100px)}
