:root{--ink:#343045;--muted:#786e81;--lavender:#8c79bb;--lilac:#e8dffd;--pink:#ffe2ed;--cream:#fff9f4;--mint:#dff5e8;--stroke:#e9dfdf;--white:#fff;--shadow:0 16px 42px rgba(89,61,109,.095);--round:24px}
    *{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:radial-gradient(circle at 8% 8%,#ffe3f0 0,transparent 28%),radial-gradient(circle at 95% 4%,#e7defe 0,transparent 30%),radial-gradient(circle at 70% 90%,#dcf4e9 0,transparent 35%),var(--cream);font-family:ui-rounded,'Trebuchet MS',system-ui,-apple-system,sans-serif;min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #8e77bb;outline-offset:3px}button:disabled{opacity:.55;cursor:not-allowed}.wrap{width:min(1140px,calc(100% - 32px));margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:23px 0 12px}.brand{font-size:1.05rem;font-weight:900;letter-spacing:-.03em;cursor:pointer;background:none;border:0;text-align:left;color:var(--ink);padding:5px}.brand span{display:inline-block;font-size:1.55rem;vertical-align:middle;margin-right:7px}.pill{background:#fff9;border:1px solid #fff;box-shadow:0 2px 15px #9992;border-radius:50px;padding:11px 16px;font-weight:800;color:#795f9d;white-space:nowrap}.hero{position:relative;text-align:center;padding:56px 12px 39px}.eyebrow{text-transform:uppercase;letter-spacing:.21em;font-size:.73rem;color:#ae7d9f;font-weight:900}.hero h1{font-size:clamp(2.65rem,7vw,5.15rem);line-height:1.08;margin:12px 0 16px;letter-spacing:-.065em}.hero h1 em{font-style:normal;color:#9570bd}.lead{color:#746a7d;font-size:1.12rem;max-width:590px;margin:0 auto;line-height:1.6}.sparkle{position:absolute;font-size:2rem;opacity:.75;pointer-events:none}.sparkle.a{left:5%;top:43px;transform:rotate(-20deg)}.sparkle.b{right:9%;top:110px}.sparkle.c{right:23%;bottom:32px;font-size:1.3rem}.section-header{display:flex;justify-content:space-between;align-items:end;gap:14px;margin:22px 0 18px}.section-header h2{margin:0;font-size:1.4rem;letter-spacing:-.04em}.muted{color:var(--muted)}.small{font-size:.88rem}.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.tile{border:1px solid rgba(255,255,255,.96);border-radius:29px;overflow:hidden;box-shadow:var(--shadow);background:white;display:flex;flex-direction:column;min-height:320px;text-align:left;transition:transform .16s,box-shadow .16s;padding:0}.tile:hover{transform:translateY(-4px);box-shadow:0 20px 46px #7b61712a}.tile-visual{height:187px;position:relative;display:flex;align-items:center;justify-content:center;font-size:4.4rem;overflow:hidden;isolation:isolate}.tile-visual:before,.tile-visual:after{content:"";position:absolute;z-index:-1;border-radius:40%;opacity:.65}.tile-visual:before{height:190px;width:200px;background:#fff8;transform:rotate(-20deg) translate(-35px,55px)}.tile-visual:after{height:165px;width:210px;background:#fff6;transform:rotate(25deg) translate(110px,-80px)}.tile-visual.case{background:linear-gradient(130deg,#e0d9f5,#fae6de)}.tile-visual.world{background:linear-gradient(135deg,#c4ead1,#ffedd6)}.tile-visual.nonogram{background:linear-gradient(140deg,#f3d8e6,#deddf9)}.tile-visual.code{background:linear-gradient(120deg,#d8e8f9,#e9dcf0)}.tile-visual .deco{position:absolute;font-size:1.6rem}.tile-visual .d1{top:22px;left:18%}.tile-visual .d2{bottom:24px;right:19%}.tile-caption{padding:21px 24px 24px;display:flex;flex-direction:column;gap:8px;flex:1}.tile-title{font-size:1.55rem;font-weight:950;letter-spacing:-.045em}.tile-meta{font-size:.88rem;color:#816e94;margin-top:auto;padding-top:13px;font-weight:800}.tile-description{color:#716b78;line-height:1.5}.footer{text-align:center;color:#968a96;font-size:.84rem;padding:45px 0 24px}.game-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:23px 0 20px}.game-title{margin:0;font-size:clamp(1.65rem,5vw,2.55rem);letter-spacing:-.05em}.game-subtitle{margin:7px 0 0;color:var(--muted);line-height:1.5}.btn{border:1px solid #e9deed;background:#fff;color:#50495b;border-radius:15px;padding:12px 17px;font-weight:850;transition:.15s}.btn:hover{background:#faf3ff;transform:translateY(-1px)}.btn.primary{background:#8f77bd;color:#fff;border-color:#8f77bd;box-shadow:0 4px 13px #967bbe50}.btn.primary:hover{background:#7963a7}.btn.soft{background:#fbf5ff}.btn.mint{background:#e3f4e8;border-color:#d4eadb;color:#437956}.btn.danger{color:#b65374}.btn.icon-btn{padding:9px 12px}.controls{display:flex;flex-wrap:wrap;gap:9px;margin-top:17px}.card{background:#ffffffdb;border:1px solid #fff;border-radius:var(--round);box-shadow:var(--shadow);padding:24px}.game-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.8fr);gap:20px;align-items:start}.tabrow{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.tab{border:1px solid #ebdfea;border-radius:99px;background:white;padding:10px 16px;color:#655975;font-weight:800}.tab.active{background:#8770b7;border-color:#8770b7;color:white}.tab.done:after{content:' ✓';color:#52ac73}.tab.active.done:after{color:#fff}.panel-label{font-size:.77rem;letter-spacing:.11em;text-transform:uppercase;font-weight:950;color:#9b80a9;margin-bottom:9px}.clue-list{margin:0;padding:0;list-style:none;display:grid;gap:11px;counter-reset:clues}.clue-list li{position:relative;counter-increment:clues;border-radius:14px;background:#fdf8ff;border:1px solid #f1e9f3;padding:12px 12px 12px 46px;line-height:1.45}.clue-list li:before{content:counter(clues);position:absolute;left:12px;top:10px;width:24px;height:24px;border-radius:50%;background:#e9dff6;color:#6e5599;display:grid;place-items:center;font-size:.73rem;font-weight:900}.board-name{font-size:1rem;font-weight:950;margin:18px 0 10px}.board-scroll{max-width:100%;overflow-x:auto;padding-bottom:5px}.logic-grid{display:grid;gap:4px;min-width:360px}.logic-grid .lg-head{display:flex;align-items:end;justify-content:center;text-align:center;padding:5px;font-size:.72rem;line-height:1.2;font-weight:900;color:#6a6271}.logic-grid .lg-person{display:flex;align-items:center;padding:0 8px;font-size:.8rem;font-weight:900;background:#f5effb;border-radius:10px}.logic-grid .lg-cell{height:43px;border:1px solid #ece5ed;background:#fff;border-radius:9px;color:#5d9c7d;font-size:1.15rem;font-weight:950}.logic-grid .lg-cell.no{color:#c57c95;background:#fff5f6}.logic-grid .lg-cell.yes{background:#e2f5e8;border-color:#b8e3c5}.logic-grid .lg-cell:hover{border-color:#ab8ccd;filter:brightness(.98)}.callout{padding:14px 16px;background:#f7f1ff;color:#69527e;border-radius:14px;line-height:1.5;margin-top:17px;font-size:.91rem}.feedback{padding:13px 15px;border-radius:12px;margin-top:13px;font-weight:800;line-height:1.5}.feedback.ok{background:#e4f6ea;color:#387450}.feedback.warn{background:#fff0e8;color:#9b604d}.feedback.info{background:#f3ebfe;color:#6d578d}.scene-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(270px,.75fr);gap:20px}.scene-shell{padding:17px}.scene{aspect-ratio:1.12/1;position:relative;overflow:hidden;border-radius:19px;box-shadow:inset 0 0 0 2px #fff8;user-select:none;touch-action:none;cursor:crosshair;isolation:isolate}.scene:before{position:absolute;inset:0;content:"";pointer-events:none}.scene.garden{background:linear-gradient(#b9e4eb 0 47%,#a4cdb1 47% 66%,#76ac8e 66% 100%)}.scene.cafe{background:linear-gradient(145deg,#fae9d8,#f6d1c4 59%,#cfa58d 59%)}.scene.bedroom{background:linear-gradient(140deg,#c6c5ef,#ddd5ed 60%,#b49e9b 60%)}.scene .sky-object,.scene .ambient{position:absolute;pointer-events:none}.scene .sun{top:12%;right:14%;width:64px;height:64px;border-radius:50%;background:#fff2b8;box-shadow:0 0 0 11px #fff7d266}.scene .cloud{font-size:2.4rem;top:11%;left:15%;opacity:.85}.scene .hill{width:95%;height:55%;border-radius:55% 55% 0 0;bottom:6%;left:-20%;background:#a6c99c}.scene .hill.two{background:#8dbd91;left:43%;bottom:5%;height:43%}.scene .path{width:24%;height:44%;background:#d9bf9c;clip-path:polygon(32% 0,65% 0,100% 100%,0 100%);left:39%;bottom:-2%;opacity:.9}.scene .window{top:11%;left:17%;width:32%;height:37%;border:11px solid #b88e94;border-radius:64px 64px 7px 7px;background:linear-gradient(#bce5e4,#edf4e4 65%,#9acfa0 66%);box-shadow:inset 0 -8px #7fac86,0 6px 0 #b48783}.scene .window:after{content:"";position:absolute;top:0;bottom:0;left:47%;width:8px;background:#b88e94}.scene .floor{bottom:0;width:100%;height:41%;background:repeating-linear-gradient(0deg,#b99180 0 2px,transparent 2px 50px),repeating-linear-gradient(90deg,#e2bc98 0 2px,#d3a98f 2px 66px);opacity:.63}.scene .counter{bottom:12%;right:5%;width:40%;height:24%;background:linear-gradient(#d9a37d 0 28%,#ae7c64 29%);border:5px solid #efca9f;border-radius:13px;box-shadow:0 10px 0 #79544d55}.scene .moon{right:13%;top:11%;font-size:4rem;opacity:.75}.scene .rug{bottom:7%;left:19%;width:62%;height:22%;background:#ecd1d4a8;border:4px solid #f6e5e7;border-radius:50%}.scene .bed{bottom:18%;left:7%;height:23%;width:42%;border-radius:18px 15px 10px 10px;border:9px solid #a98d9c;background:linear-gradient(125deg,#fff,#efe5f7)}.scene .shelf{right:11%;top:19%;height:38%;width:19%;border:9px solid #ae8ea1;border-radius:6px;box-shadow:inset 0 -32px 0 #c2a3ae,inset 0 -65px 0 #d6b8be}.scene .sticker{position:absolute;border:2px solid #fff9;background:#ffffff35;border-radius:50%;box-shadow:0 5px 5px #49465a21,0 2px 1px #fff8;font-size:clamp(1.7rem,5vw,3.25rem);width:64px;height:64px;display:flex;align-items:center;justify-content:center;padding:0;transform:translate(-50%,-50%) rotate(var(--rot,0deg));cursor:grab;touch-action:none;z-index:4;line-height:1}.scene .sticker:active{cursor:grabbing}.scene .sticker.selected{outline:3px dashed #8f77bd;outline-offset:3px;background:#fff6}.scene-hint{font-size:.85rem;text-align:center;color:#89738b;margin-top:14px}.palette{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin-top:16px}.palette button{border:1px solid #eee5eb;border-radius:13px;background:#fff;font-size:1.9rem;min-height:55px;display:grid;place-items:center}.palette button.active{outline:3px solid #a588cd;background:#f5eeff}.scene-stat{display:flex;justify-content:space-between;gap:10px;color:#766a7b;font-size:.86rem;font-weight:800;margin:6px 3px 0}.nonogram-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(250px,.85fr);gap:20px}.nonogram-wrap{display:flex;justify-content:center;overflow:auto;padding:20px 0}.nono-board{--cell:53px;display:grid;grid-template-columns:64px repeat(5,var(--cell));grid-template-rows:75px repeat(5,var(--cell));gap:5px}.nono-corner{border-radius:14px;background:#f9f3f8;display:grid;place-items:center;font-size:1.3rem}.nono-numbers{background:#fff6fa;border:1px solid #f2e6ee;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:3px;font-size:.88rem;font-weight:950;color:#aa7490}.nono-numbers.vertical{flex-direction:column;gap:0}.nono-cell{border:1px solid #e7ddea;background:#fff;border-radius:9px;font-size:1.25rem;color:#ad91c8}.nono-cell.filled{background:#c9b0de;border-color:#a48abd;box-shadow:inset 0 2px 8px #9171b028}.nono-cell.crossed{background:#fdf0f6;color:#bda4b4}.nono-cell:hover{border-color:#9374b7}.code-lines{display:grid;gap:10px}.code-line{display:flex;gap:14px;align-items:center;padding:13px;border-radius:13px;border:1px solid #eae3ec;background:#fdf9ff}.code-digits{font-size:1.28rem;letter-spacing:.27em;font-weight:950;color:#755c9b;min-width:82px}.code-desc{line-height:1.45;font-size:.85rem;color:#68606e}.code-input{padding:13px 14px;border:2px solid #e4d7e8;border-radius:14px;background:#fff;color:#514261;font-weight:950;font-size:1.3rem;letter-spacing:.3em;width:155px;max-width:100%;text-align:center}.badge-small{font-size:.76rem;font-weight:900;background:#e7f4e6;border-radius:40px;padding:6px 11px;color:#54785a}.gallery{display:flex;flex-wrap:wrap;gap:8px}.gallery span{background:#fff;border:1px solid #eadfee;border-radius:50px;padding:9px 12px;font-size:.86rem;color:#7b638d;font-weight:800}.home-pitch{margin-top:30px;background:#ffffff9a;border:1px solid #fff;border-radius:24px;text-align:center;padding:25px;color:#7a6c82;box-shadow:var(--shadow)}.home-pitch b{color:#775e8e}.toast{position:fixed;z-index:50;left:50%;bottom:20px;transform:translateX(-50%);background:#524667;color:#fff;padding:13px 20px;border-radius:50px;box-shadow:0 7px 40px #28203344;max-width:min(600px,94vw);text-align:center;font-size:.92rem;font-weight:850;pointer-events:none}.toast[hidden]{display:none}.success-art{font-size:3.3rem;text-align:center;margin-bottom:10px}.success-title{text-align:center;font-size:1.5rem;font-weight:950;margin:3px 0 8px}.success-text{text-align:center;color:#746b7c;line-height:1.5}.divider{border:0;border-top:1px solid #f0e6ee;margin:21px 0}.help-row{display:flex;align-items:center;gap:10px;margin:10px 0}.help-dot{flex:0 0 22px;height:22px;border-radius:6px;background:#d0b4e1;border:1px solid #b79bc6}.help-dot.empty{background:#fff}.help-dot.cross{background:#fbe8ed}.legend{font-size:.88rem;color:#6f6479;line-height:1.55}.screen-reader{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
    @media(max-width:800px){.game-layout,.scene-layout,.nonogram-layout{grid-template-columns:1fr}.topbar{padding-top:12px}.tiles{gap:13px}.tile-visual{height:150px}.tile{min-height:310px}.scene-shell{padding:10px}.scene .sticker{width:56px;height:56px}.game-head{align-items:flex-start}.card{padding:17px}}
    @media(max-width:560px){.wrap{width:min(100% - 22px,1140px)}.hero{padding:35px 8px 25px}.sparkle{display:none}.tiles{grid-template-columns:1fr}.tile{min-height:0}.tile-visual{height:155px}.tile-caption{padding:17px}.game-head{flex-wrap:wrap}.pill{font-size:.75rem;padding:9px 11px}.nono-board{--cell:min(11vw,49px);grid-template-columns:48px repeat(5,var(--cell));grid-template-rows:62px repeat(5,var(--cell));gap:3px}.nono-numbers{font-size:.79rem}.nono-cell{border-radius:6px}.palette{grid-template-columns:repeat(5,minmax(0,1fr))}.scene .sticker{font-size:1.75rem;width:49px;height:49px}.code-line{gap:7px;padding:9px}.code-digits{font-size:1.06rem;min-width:72px}.game-head .btn{order:0}.card{border-radius:20px}}
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* G2-R1: dossiês, caderno e leitura de pistas. Demais jogos preservados. */
.case-meta {display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:8px}
.case-meta .panel-label {margin:0}
.case-difficulty {color:#6a5383;background:#efe5f7;border-radius:999px;padding:6px 12px;font-size:.73rem;font-weight:900}
.case-story {background:#fff9ee;border:1px solid #f4e8d5;border-radius:15px;margin:16px 0;padding:13px 16px;color:#735e56;line-height:1.55}
.case-story summary {cursor:pointer;font-weight:950;color:#87684c}
.case-story p {margin:9px 0 0;font-size:.9rem}
.case-clues li {display:flex;align-items:flex-start;gap:9px;padding-left:45px}
.case-clues li.reviewed {background:#f1fbf4;border-color:#dcf1e2}
.case-clues li.reviewed>span {color:#677768}
.case-clues .clue-toggle {border:1px solid #d9c8eb;border-radius:10px;background:#fff;color:#73559b;min-width:30px;height:30px;font-size:1rem;line-height:1;font-weight:950;flex:0 0 auto}
.case-clues li.reviewed .clue-toggle {background:#dcf5e4;color:#397958;border-color:#bde0c9}
.case-notebook {margin-top:22px;display:grid;gap:7px}
.case-notebook label {font-size:.96rem;color:#655471}
.case-notebook p {margin:0}
.case-notebook textarea {width:100%;max-width:100%;min-height:100px;resize:vertical;background:#fffdfd;border:2px solid #eadfed;border-radius:13px;padding:12px;font:inherit;line-height:1.45;color:#554b61}
.case-notebook textarea:focus-visible,.case-clues .clue-toggle:focus-visible,.lg-cell:focus-visible{outline:3px solid #8363b5;outline-offset:2px}
.case-hints-title {font-size:1rem;margin:0 0 8px}
.case-clues .clue-toggle:hover {filter:brightness(.97)}
.btn:disabled {cursor:default;opacity:.65}

/* G2-R2: ferramentas de grade, feedback e dedução. */
.case-board-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:17px 0 7px;padding:12px;background:#fff9fb;border:1px solid #f1e5ed;border-radius:14px}
.tool-chip{font:inherit;font-size:.82rem;font-weight:850;border:1px solid #e6d8ee;background:#fff;color:#745f83;border-radius:999px;padding:9px 12px;cursor:pointer}
.tool-chip.active{background:#e9dbf3;border-color:#b79bcc;color:#563e72;box-shadow:0 0 0 2px #ffffff inset}
.tool-chip:focus-visible{outline:3px solid #7d5ca6;outline-offset:2px}
.case-board-status{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;font-size:.82rem;color:#81738b;margin:14px 0}
.case-board-status span:first-child{font-weight:900;color:#69517f}

/* G3-R1: quarto cenário original e controles não destrutivos. */
.scene.balcony{background:linear-gradient(180deg,#9bb5cb 0%,#c6d7df 49%,#c0a39f 50%,#ac8291 100%)}
.scene.balcony .rain-window{position:absolute;left:12%;top:8%;width:76%;height:51%;border:12px solid #ead8d6;border-radius:85px 85px 8px 8px;background:repeating-linear-gradient(105deg,#b2d7e577 0 3px,transparent 3px 16px),linear-gradient(160deg,#8aacc2,#bbd9e1 63%,#84a5aa 64%);box-shadow:inset 0 -7px #92aeb1,0 5px 0 #876f83}
.scene.balcony .rain-window:after{content:"";position:absolute;left:49%;top:0;bottom:0;width:9px;background:#ead8d6}
.scene.balcony .balcony-floor{left:0;right:0;bottom:0;height:36%;background:repeating-linear-gradient(90deg,#d5adb1 0 4px,#bc939d 4px 48px);border-top:10px solid #ddbdc0}
.scene.balcony .balcony-rail{left:5%;right:5%;bottom:23%;height:10px;background:#7f798c;box-shadow:0 7px 0 #e8d7cf88;border-radius:8px}
.scene.balcony .rain-lamp{right:10%;top:9%;font-size:3rem}
.scene .sticker{scale:var(--scale,1);z-index:4}
.scene .sticker:focus-visible{outline:3px solid #73539e;outline-offset:4px}
.scene .sticker.selected{z-index:5}
@media(max-width:560px){.case-board-toolbar{gap:6px}.tool-chip{font-size:.75rem;padding:8px 10px}.case-board-status{font-size:.76rem}}
/* G4 base: transferência de progresso sem backend ou conta. */
.backup-panel{margin:23px 0 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:15px;padding:22px;background:#fffaf1;border:1px solid #f1e4d5;border-radius:23px;box-shadow:var(--shadow)}
.backup-panel>div:first-child{flex:1;min-width:230px;max-width:610px}
.backup-panel h2{font-size:1.25rem;margin:3px 0 8px;color:#685370}
.backup-panel p{margin:5px 0}
.backup-panel .controls{margin:0}

/* G3-R2 — stickers desenhados em SVG e cenários ilustrados originais. */
.scene .scene-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none;z-index:0}
.scene .sticker{width:78px;height:78px;border:none;border-radius:0;background:transparent;box-shadow:none;padding:2px;line-height:1;filter:drop-shadow(0 4px 2px rgba(83,60,84,.22));z-index:4;transition:filter .12s ease}
.scene .sticker:hover{filter:drop-shadow(0 6px 3px rgba(83,60,84,.29))}
.scene .sticker.selected{z-index:4;background:transparent;outline:3px dashed #73539e;outline-offset:2px;border-radius:14px}
.scene .sticker-art{width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
.sticker-fallback{font-size:2.3rem;display:inline-flex;align-items:center;justify-content:center}
.palette{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.palette button{min-width:0;min-height:102px;padding:6px 3px 7px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:#fffdfc;border:1px solid #eddfeb;border-radius:15px;transition:transform .12s ease,background .12s ease}
.palette button:hover{transform:translateY(-2px);background:#fff8f2}
.palette button.active{background:#f4eaf9;border-color:#a58dbe;outline:2px solid #a58dbe}
.palette-art{height:64px;width:64px;max-width:100%;object-fit:contain;pointer-events:none}
.palette-name{font:700 .68rem/1.2 system-ui,sans-serif;color:#735d77;text-align:center;max-width:100%;overflow-wrap:anywhere}
.scene-shell .scene{border:6px solid #fff9f2;box-shadow:inset 0 0 0 1px #e9d9d5,0 8px 24px rgba(109,83,115,.12)}
.scene-shell .scene-hint{margin-top:12px}
@media(max-width:800px){.scene .sticker{width:72px;height:72px}}
@media(max-width:560px){.scene .sticker{width:58px;height:58px}.palette{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.palette button{min-height:88px}.palette-art{height:51px;width:51px}.palette-name{font-size:.61rem}}

/* G4-R1: biblioteca, progresso e controles de leitura */
.skip-link{position:absolute;top:-100px;left:16px;z-index:999;border-radius:12px;padding:12px 16px;background:#343045;color:#fff;font-weight:900}
.skip-link:focus{top:10px}
.topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.settings-trigger{padding:10px 14px;white-space:nowrap}
.settings-panel{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:4px 0 16px;padding:14px 20px;border-radius:18px;background:#fff;box-shadow:var(--shadow);border:1px solid #e9deed}
.settings-panel[hidden]{display:none}
.settings-panel p{margin:5px 0 0}
.settings-panel .controls{margin-top:0}
.settings-panel button[aria-pressed="true"]{background:#e8dffd;border-color:#8c79bb;color:#453263}
.journey-panel{display:flex;align-items:center;justify-content:space-between;gap:28px;margin:0 0 27px;padding:24px 28px;background:#fffdfc;border:1px solid #eee5eb;border-radius:24px;box-shadow:var(--shadow)}
.journey-content{flex:1;min-width:0}
.journey-panel h2{margin:0 0 4px;line-height:1.25;font-size:1.45rem}
.journey-panel p{margin:7px 0 14px;line-height:1.5}
.continue-btn{white-space:normal;max-width:260px;text-align:center}
.progress-track{display:block;height:10px;background:#eee7f3;border-radius:30px;overflow:hidden;border:1px solid #e7ddec}
.progress-track>span{display:block;height:100%;background:linear-gradient(90deg,#83c9a0,#8b77bd);border-radius:30px;transition:width .2s ease}
.library-filters{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 19px}
.filter-chip{border:1px solid #e5dce9;background:#fffdfd;color:#654f75;border-radius:99px;padding:11px 17px;font-weight:850;min-height:44px}
.filter-chip.active{background:#8770b7;color:white;border-color:#8770b7}
.tile-tag{font-size:.73rem;letter-spacing:.06em;text-transform:uppercase;font-weight:950;color:#755f94}
.tile-progress-label{display:flex;justify-content:space-between;gap:8px;margin-top:auto;font-size:.82rem;color:#635471;font-weight:800}
.tile-caption .progress-track{width:100%;height:9px}
.tile-caption .tile-meta{margin-top:0;padding-top:6px}
.empty-library{background:#fff;border:1px dashed #b9a6cc;padding:32px;border-radius:20px;text-align:center;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:14px;color:#6c5a7b;line-height:1.5}
#app:focus{outline:none}
html.large-text{font-size:112.5%}
html.reduced-motion,html.reduced-motion *{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
@media(prefers-reduced-motion:reduce){html,html *{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(max-width:700px){.topbar{flex-wrap:wrap}.topbar-actions{width:100%;justify-content:space-between}.journey-panel{flex-direction:column;align-items:stretch;gap:10px;padding:19px}.continue-btn{max-width:none}.tile-caption{padding:19px}.tile-visual{height:170px}}
@media(max-width:420px){.pill{white-space:normal;font-size:.82rem}.topbar-actions{gap:6px}.settings-trigger{padding:9px 11px}.library-filters .filter-chip{padding:10px 12px}.journey-panel h2{font-size:1.24rem}}

.home-guide{max-width:790px;margin:0 auto 26px;padding:12px 20px;border-radius:18px;border:1px solid #e9deed;background:#fffdfc}
.home-guide summary{cursor:pointer;font-weight:850;color:#71578e;padding:5px 0;line-height:1.6}
.home-guide p{color:#675d70;line-height:1.6;margin:7px 0 8px}

/* G5-R1: inspirações opcionais nos novos e antigos cenários. */
.inspiration-card{padding:13px 15px;margin:16px 0;border:1px solid #efe3f3;background:#fcf7ff;border-radius:15px}
.inspiration-card .panel-label{margin-bottom:5px}
.inspiration-card p{font-size:.92rem;line-height:1.5;margin:0 0 11px;color:#665c76}
.inspiration-card .btn{padding:8px 12px;font-size:.85rem}
.scene.library{background:linear-gradient(155deg,#c9dfee 0 60%,#d0a98c 60% 100%)}
.scene.atelier{background:linear-gradient(155deg,#f5e4ce 0 60%,#bca5b6 60% 100%)}

/* G5-R2: scalable nonograms (5/6/7), horizontal scroll on narrow viewports. */
.nono-board{grid-template-columns:64px repeat(var(--nono-size),var(--cell));grid-template-rows:75px repeat(var(--nono-size),var(--cell));flex:none}
.nono-progress{font-size:.85rem;font-weight:800;color:#7b638d;text-align:center;margin:0 0 10px}
.nonogram-wrap{justify-content:safe center;max-width:100%;overscroll-behavior-x:contain;scrollbar-width:thin}
.nono-board .nono-cell{min-width:0;min-height:0}
@media(max-width:560px){
 .nono-board{--cell:clamp(36px,11vw,49px);grid-template-columns:48px repeat(var(--nono-size),var(--cell));grid-template-rows:62px repeat(var(--nono-size),var(--cell));gap:3px}
 .nonogram-wrap{justify-content:flex-start}
 .nono-board[style*="--nono-size:5"]{margin-inline:auto}
 .code-input{width:182px;letter-spacing:.22em}
}
/* Grid items must shrink below the puzzle's intrinsic width so only the board scrolls. */
.nonogram-layout,.nonogram-layout>.card{min-width:0}
.nonogram-wrap{width:100%;min-width:0}
/* G5-R2: keep large level collections compact and keyboard-scrollable. */
.level-strip{margin-bottom:17px;min-width:0}
.level-strip .tabrow{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;margin-bottom:0;padding:3px 1px 8px;scrollbar-width:thin;overscroll-behavior-x:contain}
.level-strip .tab{flex:0 0 auto;white-space:nowrap}
.level-strip-hint{font-size:.77rem;color:#796986;margin:3px 0 0;text-align:right}