.announcement-bar{position:relative;z-index:30;display:flex;gap:14px;align-items:center;padding:10px 5vw;background:#171717;color:#fff;font-size:13px}.announcement-bar[hidden]{display:none}.announcement-bar>span{background:var(--coral,#ff6847);padding:3px 8px;border-radius:99px;font-weight:800}.announcement-bar p{margin:0;flex:1}.announcement-bar button{border:0;background:none;color:#fff;text-decoration:underline;cursor:pointer}.playground{max-width:1240px;margin:48px auto 80px;padding:0 24px}.playground-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px}.playground-head h2{font-size:clamp(28px,4vw,50px);line-height:1;margin:6px 0}.playground-head p{max-width:260px}.play-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.play-cards button{min-height:190px;padding:20px;border:2px solid #171717;border-radius:18px;background:#fff8ed;box-shadow:5px 5px 0 #171717;display:flex;flex-direction:column;text-align:left;cursor:pointer;transition:.18s}.play-cards button:hover{transform:translate(-2px,-4px);box-shadow:8px 9px 0 #171717}.play-cards button:nth-child(2){background:#ff735c}.play-cards button:nth-child(3){background:#c9f36b}.play-cards button:nth-child(4){background:#98d9ff}.play-cards b{font:700 12px Manrope}.play-cards span{margin-top:auto;font-size:21px;font-weight:800}.play-cards small{display:block;font-size:12px;font-weight:500;margin-top:5px}.play-cards i{align-self:end;font-size:28px;font-style:normal}.tool-modal{width:min(900px,calc(100% - 28px));max-height:88vh;padding:0;border:2px solid #171717;border-radius:22px;background:#fff8ed;box-shadow:10px 10px 0 #171717}.tool-modal::backdrop,#helpModal::backdrop,.announcement-modal::backdrop{background:rgba(20,20,20,.66);backdrop-filter:blur(5px)}.tool-modal-head{display:flex;gap:14px;align-items:center;padding:24px 28px;border-bottom:2px solid #171717}.tool-modal-head>span{width:52px;height:52px;display:grid;place-items:center;border:2px solid #171717;border-radius:14px;background:#c9f36b;font-size:24px}.tool-modal-head small{font:700 11px Manrope;letter-spacing:.12em}.tool-modal-head h2{margin:2px 0 0;font-size:30px}.tool-modal .modal-close{z-index:2}.tool-intro{padding:0 28px;margin:22px 0 10px;color:#555}.studio-panel{margin:0 28px 18px;padding:20px;border:2px solid #171717;border-radius:16px;background:#fff}.studio-field{display:grid;gap:7px;margin-bottom:14px;font-weight:700}.studio-field input,.studio-field textarea,.studio-field select,.unit-line input,.unit-line select{width:100%;padding:12px;border:2px solid #171717;border-radius:10px;background:#fff;font:inherit}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.studio-run{min-height:45px}.button-row{display:flex;gap:10px;flex-wrap:wrap}#studioResult{margin:0 28px 28px}.tool-result{padding:18px;border:2px solid #171717;border-radius:14px;background:#c9f36b;animation:result-in .25s ease}.tool-result.bad{background:#ffd4cc}.tool-result pre{white-space:pre-wrap;overflow:auto;margin:0}.tool-result code{font-size:18px}.drop-file{min-height:110px;border:2px dashed #171717;border-radius:14px;display:grid;place-items:center;text-align:center;padding:20px;cursor:pointer}.drop-file input{position:absolute;opacity:0;pointer-events:none}.drop-file small,.file-preview small{display:block;color:#666;margin-top:4px}.file-preview{min-height:70px;margin:14px 0;border:1px solid #bbb;border-radius:12px;padding:12px;display:grid;gap:8px}.file-preview.empty{place-items:center;color:#777}.file-preview img{max-width:100%;max-height:280px;margin:auto;border-radius:8px}.processed-preview{max-width:220px;max-height:180px;display:block;margin-bottom:12px;border:2px solid #171717}.unit-line{display:grid;grid-template-columns:1fr 1fr auto 1fr;align-items:center;gap:8px}.random-pop{display:block;font-size:clamp(32px,8vw,70px);font-weight:900;line-height:1.1;margin-bottom:8px}.love-score{text-align:center}.love-score b{display:block;font:900 74px Manrope;color:#ff4f6d}.love-score span{font-size:22px;font-weight:800}.card-maker{display:grid;grid-template-columns:1fr 1fr;gap:20px}.card-maker canvas{width:100%;border:2px solid #171717;border-radius:12px}.help-fab{position:fixed;z-index:25;right:22px;bottom:22px;border:2px solid #171717;border-radius:99px;padding:9px 16px 9px 9px;background:#fff8ed;box-shadow:4px 4px 0 #171717;font-weight:800;cursor:pointer}.help-fab span{display:inline-grid;place-items:center;width:30px;height:30px;margin-right:7px;background:#4b5cff;color:#fff;border-radius:50%}.announcement-modal{width:min(560px,calc(100% - 30px));padding:30px;border:2px solid #171717;border-radius:20px;background:#fff8ed}.announcement-modal img{width:100%;max-height:260px;object-fit:cover;border-radius:12px;margin-bottom:18px}@keyframes result-in{from{transform:translateY(8px);opacity:0}}.qr-canvas-wrap{position:relative}.qr-canvas-wrap #qrLogo{position:absolute;width:50px;height:50px;object-fit:contain;left:50%;top:50%;transform:translate(-50%,-50%);padding:5px;background:#fff;border-radius:8px}.qr-canvas-wrap #qrLogo:not([src]){display:none}#qrCanvas canvas,#qrCanvas img{display:block}.form-result{min-height:22px;font-weight:700}
@media(max-width:800px){.play-cards{grid-template-columns:1fr 1fr}.playground-head{display:block}.card-maker{grid-template-columns:1fr}.tool-modal-head{padding:18px}.studio-panel,#studioResult{margin-left:16px;margin-right:16px}.tool-intro{padding:0 16px}.two-fields{grid-template-columns:1fr}.help-fab{font-size:0;padding:8px}.help-fab span{margin:0}.unit-line{grid-template-columns:1fr 1fr}.unit-line span{display:none}}@media(max-width:480px){.play-cards{grid-template-columns:1fr}.play-cards button{min-height:140px}}
.admin-list{display:grid;gap:10px}.admin-list>div{display:grid;padding:12px 0;border-bottom:1px solid #bbb}.admin-list small,.ticket-table small{color:#666}.ticket-table{display:grid;gap:10px}.ticket-table article{display:grid;grid-template-columns:1fr auto;gap:18px;padding:16px;border:2px solid #171717;border-radius:12px;background:#fff}.ticket-table article p{margin:8px 0 0}.ticket-table form{display:flex;gap:8px;align-items:start}.ticket-table select{padding:9px;border:2px solid #171717;border-radius:8px;background:#fff}.admin-main>.panel{margin:20px 0}.settings-card label,.panel form>label{display:grid;gap:6px;margin:12px 0;font-weight:700}.settings-card input,.panel form>label input,.panel form>label textarea{padding:11px;border:2px solid #171717;border-radius:9px;background:#fff;font:inherit}@media(max-width:700px){.ticket-table article{grid-template-columns:1fr}.ticket-table form{flex-wrap:wrap}}
.wheel-stage{position:relative;width:min(100%,520px);margin:18px auto}.wheel-stage canvas{display:block;width:100%;height:auto;filter:drop-shadow(8px 10px 0 #171717)}.wheel-pin{position:absolute;z-index:2;left:50%;top:-13px;transform:translateX(-50%);font-size:42px;color:#171717;text-shadow:0 2px #fff8ed}.game-win{display:grid;gap:7px;text-align:center;animation:game-pop .45s cubic-bezier(.2,1.6,.4,1)}.game-win span{font-weight:700}.game-win b{font-size:clamp(30px,7vw,64px);line-height:1.05}.guess-board{display:grid;gap:14px;text-align:center}.guess-board>input{width:180px;margin:auto;padding:16px;border:3px solid #171717;border-radius:14px;text-align:center;font:900 32px Manrope}.guess-meter{height:16px;overflow:hidden;border:2px solid #171717;border-radius:99px;background:#fff}.guess-meter i{display:block;width:50%;height:100%;background:#ff735c;transition:width .35s}.celebrate{animation:game-pop .5s}.shuffle-deck{position:relative;height:115px;width:130px;margin:10px auto}.shuffle-deck i{position:absolute;inset:8px 20px;border:2px solid #171717;border-radius:12px;background:#98d9ff;box-shadow:4px 4px 0 #171717;transition:.35s}.shuffle-deck i:nth-child(2){transform:rotate(7deg);background:#c9f36b}.shuffle-deck i:nth-child(3){transform:rotate(-7deg);background:#ff735c}.shuffle-deck.playing i:nth-child(1){transform:translateX(-70px) rotate(-20deg)}.shuffle-deck.playing i:nth-child(2){transform:translateX(70px) rotate(20deg)}.shuffle-deck.playing i:nth-child(3){transform:rotate(360deg) scale(1.08)}.quiz-progress,.ocr-progress{height:14px;overflow:hidden;border:2px solid #171717;border-radius:99px;background:#fff}.quiz-progress i,.ocr-progress i{display:block;width:0;height:100%;background:#4b5cff;transition:width .35s}.quiz-stage{min-height:270px;display:grid;align-content:center}.quiz-stage h3{text-align:center;font-size:clamp(24px,4vw,38px)}.quiz-stage>div{display:grid;gap:10px}.quiz-stage [data-answer]{display:flex;gap:12px;align-items:center;padding:14px;border:2px solid #171717;border-radius:12px;background:#fff;text-align:left;font:700 16px inherit;cursor:pointer;box-shadow:3px 3px 0 #171717;transition:.18s}.quiz-stage [data-answer]:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 #171717}.quiz-stage [data-answer].selected{background:#c9f36b;transform:scale(.98)}.quiz-stage [data-answer] span{width:32px;height:32px;display:grid;place-items:center;border:2px solid #171717;border-radius:50%;background:#fff8ed}.quiz-score{text-align:right;font:700 12px Manrope}.quiz-finish{text-align:center}.heart-burst{font-size:90px;color:#ff4f6d;animation:heart-beat .8s infinite alternate}.ocr-progress{position:relative;height:28px;margin:14px 0}.ocr-progress span{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;font-weight:800}.ocr-progress i{background:#c9f36b}.ocr-output{width:100%;box-sizing:border-box;margin-bottom:12px;padding:12px;border:2px solid #171717;border-radius:10px;background:#fff;font:inherit}@keyframes game-pop{from{opacity:0;transform:scale(.65) rotate(-3deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes heart-beat{to{transform:scale(1.15) rotate(6deg)}}
.rps-score{display:flex;justify-content:center;gap:28px;align-items:center}.rps-score b{font-size:18px}.rps-score span{display:inline-grid;place-items:center;min-width:34px;padding:4px;border:2px solid #171717;border-radius:8px;background:#c9f36b}.rps-score i{font:900 13px Manrope}.rps-arena{display:flex;justify-content:center;align-items:center;gap:35px;margin:24px 0}.rps-arena strong{font-size:82px;filter:drop-shadow(4px 5px 0 #aaa)}.rps-arena strong:last-child{transform:scaleX(-1)}.rps-arena.battle strong:first-child{animation:punch-left .5s}.rps-arena.battle strong:last-child{animation:punch-right .5s}.rps-arena em{font:900 18px Manrope}.rps-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.rps-buttons button{padding:13px;border:2px solid #171717;border-radius:10px;background:#fff;font-weight:800;cursor:pointer;box-shadow:3px 3px 0 #171717}.coin3d,.dice3d{width:140px;height:140px;margin:25px auto;display:grid;place-items:center;border:4px solid #171717;background:#ffd36e;font:900 32px Manrope;box-shadow:8px 9px 0 #171717}.coin3d{border-radius:50%}.dice3d{border-radius:25px;font-size:88px;background:#fff}.coin3d.rolling{animation:coin-roll .85s ease-out}.dice3d.rolling{animation:dice-roll .85s ease-out}.chance-history{display:flex;justify-content:center;gap:6px;margin:12px}.chance-history span{padding:5px 9px;border:2px solid #171717;border-radius:8px;background:#fff}.truth-card{min-height:210px;padding:28px;display:grid;place-items:center;text-align:center;border:3px solid #171717;border-radius:20px;background:#ffd36e;box-shadow:7px 7px 0 #171717}.truth-card small{font-weight:800}.truth-card b{font-size:42px}.truth-card p{font-size:20px}.truth-card.flip{animation:card-flip .5s}.coral{background:#ff735c!important}@keyframes punch-left{50%{transform:translateX(30px) rotate(15deg)}}@keyframes punch-right{50%{transform:scaleX(-1) translateX(30px) rotate(15deg)}}@keyframes coin-roll{to{transform:rotateY(1080deg) rotateX(180deg)}}@keyframes dice-roll{to{transform:rotate(720deg) scale(.75)}}@keyframes card-flip{50%{transform:rotateY(90deg) scale(.92)}}
.room-entry{margin-top:18px;padding:22px;border:2px solid #171717;border-radius:18px;background:#171717;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:25px}.room-entry h3{margin:3px 0;font-size:26px}.room-entry p{margin:0;color:#ccc}.room-entry>div:last-child{display:grid;grid-template-columns:170px auto;gap:8px}.room-entry input{padding:13px;border:2px solid #fff;border-radius:10px;background:#fff;color:#171717;text-align:center;font:900 22px Manrope;letter-spacing:.15em}.room-entry small{grid-column:1/-1;color:#ffd36e;min-height:18px}@media(max-width:650px){.room-entry{display:grid}.room-entry>div:last-child{grid-template-columns:1fr}}
.support-chat{width:min(520px,100%)}#supportMessages{height:340px;overflow:auto;display:grid;align-content:start;gap:8px;margin:12px 0;padding:8px;background:#eee7dc;border:2px solid #171717;border-radius:12px}#supportMessages article{max-width:82%;padding:10px 12px;border:2px solid #171717;border-radius:4px 14px 14px;background:#fff}#supportMessages article.admin{margin-left:auto;background:#c9f36b;border-radius:14px 4px 14px 14px}#supportMessages article p{margin:3px 0;white-space:pre-wrap}#supportMessages article small{font-size:10px;color:#666}#supportReply{display:grid;grid-template-columns:1fr auto;gap:8px}#supportReply textarea{padding:10px;border:2px solid #171717;border-radius:10px;resize:none;font:inherit}.text-button{border:0;background:none;text-decoration:underline;margin-top:10px;cursor:pointer}
.help-fab.has-reply:after{content:'1';position:absolute;right:-4px;top:-7px;width:22px;height:22px;display:grid;place-items:center;border:2px solid #171717;border-radius:50%;background:#ff735c;color:#fff;font:800 11px Manrope}
.admin-chat-ticket>div{min-width:0}.admin-chat-thread{max-height:300px;overflow:auto;display:grid;gap:7px;margin:10px 0;padding:10px;background:#eee7dc;border-radius:10px}.admin-chat-thread p{max-width:80%;display:grid;gap:3px;padding:9px;margin:0!important;border:1px solid #171717;border-radius:4px 12px 12px;background:#fff}.admin-chat-thread p.admin{margin-left:auto!important;background:#c9f36b;border-radius:12px 4px 12px 12px}.admin-chat-thread p span{font-size:13px}.admin-chat-reply{display:grid!important;grid-template-columns:1fr auto;gap:7px}.admin-chat-reply textarea{padding:9px;border:2px solid #171717;border-radius:9px;resize:none;font:inherit}
.real-calculator{max-width:430px;margin:auto}.real-calculator>input{box-sizing:border-box;width:100%;padding:20px;border:3px solid #171717;border-radius:14px;text-align:right;font:800 36px Manrope;background:#fff8ed}.calc-keys{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}.calc-keys button{min-height:54px;border:2px solid #171717;border-radius:11px;background:#fff;font:800 20px Manrope;box-shadow:3px 3px 0 #171717;cursor:pointer}.calc-keys .equals{background:#4b5cff;color:#fff}.calc-form{display:grid;grid-template-columns:repeat(2,1fr);gap:0 12px}.grade-row{display:grid;grid-template-columns:1fr 90px 90px 42px;gap:7px;margin-bottom:8px}.grade-row>*{min-width:0;padding:10px;border:2px solid #171717;border-radius:9px;background:#fff}.question-count{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0}.question-count button{padding:8px 12px;border:2px solid #171717;border-radius:99px;background:#fff;cursor:pointer}.question-count button.active{background:#c9f36b}.question-count input{width:70px;padding:8px;border:2px solid #171717;border-radius:9px}.question-builder{padding:14px;margin:10px 0;border:2px solid #171717;border-radius:13px;background:#fff8ed}.question-builder>input{box-sizing:border-box;width:100%;margin:8px 0;padding:10px;border:2px solid #171717;border-radius:8px}.question-builder>div{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.question-builder>div input{min-width:0;padding:9px;border:2px solid #171717;border-radius:8px}.criteria-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.envelope-preview,.envelope-receiver{--card-color:#ff735c;position:relative;width:min(100%,430px);height:330px;margin:50px auto 24px;perspective:1000px}.envelope-preview .letter,.envelope-receiver .letter{position:absolute;z-index:1;left:7%;right:7%;bottom:35px;min-height:220px;box-sizing:border-box;padding:22px;border:2px solid #171717;border-radius:10px;background:#fff8ed;transition:.9s cubic-bezier(.2,.8,.2,1);overflow:auto}.envelope-back{position:absolute;z-index:2;inset:auto 0 0;height:190px;border:2px solid #171717;border-radius:8px;background:var(--card-color,#ff735c);clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%)}.envelope-flap{position:absolute;z-index:3;left:0;right:0;bottom:94px;height:98px;border:2px solid #171717;background:var(--card-color,#ff735c);clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:.65s}.envelope-preview button,.envelope-receiver button{position:absolute;z-index:5;left:50%;bottom:62px;transform:translateX(-50%);padding:10px 16px;border:2px solid #171717;border-radius:99px;background:#fff8ed;font-weight:800;cursor:pointer}.envelope-preview.open .envelope-flap,.envelope-receiver.open .envelope-flap{transform:rotateX(180deg);z-index:0}.envelope-preview.open .letter,.envelope-receiver.open .letter{transform:translateY(-145px) rotate(-1deg);z-index:4}.envelope-preview.open button,.envelope-receiver.open button{opacity:0;pointer-events:none}.share-page{min-height:100vh;background:#f5efe5}.share-shell{max-width:760px;margin:auto;padding:28px 18px 80px}.share-card{margin-top:35px;padding:clamp(22px,5vw,50px);border:2px solid #171717;border-radius:24px;background:#fff8ed;box-shadow:9px 9px 0 #171717;text-align:center}.share-card h1{font-size:clamp(29px,6vw,52px)}.answer-grid{display:grid;gap:10px}.answer-grid button{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #171717;border-radius:12px;background:#fff;box-shadow:4px 4px 0 #171717;font:700 16px inherit;cursor:pointer}.answer-grid button.selected{background:#c9f36b}.answer-grid span{width:34px;height:34px;display:grid;place-items:center;border:2px solid #171717;border-radius:50%}.love-percent{display:block;font:900 80px Manrope;color:#ff4f6d}.response-list{display:grid;gap:12px;text-align:left}.response-list article{padding:15px;border:2px solid #171717;border-radius:12px;background:#fff}.response-list header{display:flex;justify-content:space-between}.response-list small{display:block;margin-top:9px}.public-rooms{max-width:1240px;margin:12px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.public-rooms[hidden]{display:none}.public-rooms a{padding:16px;border:2px solid #171717;border-radius:13px;background:#fff8ed;color:#171717;text-decoration:none;box-shadow:3px 3px 0 #171717}.public-rooms a b,.public-rooms a small{display:block}
@media(max-width:700px){.calc-form,.criteria-grid,.public-rooms{grid-template-columns:1fr}.grade-row{grid-template-columns:1fr 75px 70px 40px}.question-builder>div{grid-template-columns:1fr}.envelope-preview,.envelope-receiver{height:360px}}
.category-strip{margin:0 0 24px;position:sticky;top:72px;z-index:12;box-shadow:0 8px 20px rgba(20,20,20,.07)}.admin-data-table{display:grid;gap:9px}.admin-data-table article{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px;border:2px solid #171717;border-radius:11px;background:#fff}.admin-data-table article div:first-child{display:grid}.admin-data-table small{color:#666}.admin-data-table form{display:flex;gap:7px}.admin-data-table select{padding:8px;border:2px solid #171717;border-radius:8px;background:#fff}.admin-main>section[hidden]{display:none!important}@media(max-width:700px){.admin-data-table article{align-items:flex-start;flex-direction:column}}

.question-builder .answer-key{display:grid;grid-template-columns:auto 1fr;gap:5px 7px;align-items:center;padding:8px;border:2px solid #171717;border-radius:10px;background:#fff}.question-builder .answer-key>input[type="radio"]{width:20px;height:20px;padding:0;accent-color:#4b5cff}.question-builder .answer-key>.qoption{grid-column:2}.question-builder .answer-key>small{grid-column:2;color:#666}.question-builder .answer-key:has(input[type="radio"]:checked){background:#c9f36b}.question-builder .answer-key:has(input[type="radio"]:checked)>small{font-weight:800;color:#171717}

