:root{ --blue:#0A68FF;--blue2:#0752D6;--navy:#111957;--turq:#0CC8BA;--green:#19B96E;--yellow:#FFC51A;--orange:#FF7B37;--coral:#FF5B67;--pink:#F53D8B;--purple:#7547DC; --text:#111957;--text2:#465278;--muted:#6E7894;--border:#DCE8F2;--surface:#fff;--bg:#F5F9FD;--shadow:0 18px 48px rgba(25,61,105,.12);--font:Inter,Aptos,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--ease:cubic-bezier(.2,.75,.2,1) } *{box-sizing:border-box}html{color-scheme:light}body{margin:0;min-width:320px;min-height:100vh;font-family:var(--font);color:var(--text);background:radial-gradient(circle at 3% 6%,rgba(245,61,139,.28),transparent 12rem),radial-gradient(circle at 97% 4%,rgba(255,197,26,.28),transparent 12rem),linear-gradient(180deg,#BEEBFF 0,#EAF7FF 18%,#F7FBFF 48%,#F7FAFE 100%);overflow-x:hidden;-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}.is-hidden{display:none!important}.skip-link{position:fixed;left:12px;top:12px;z-index:5000;transform:translateY(-150%);padding:10px 14px;border-radius:12px;background:var(--navy);color:#fff;font-weight:800;text-decoration:none}.skip-link:focus{transform:none}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:none;box-shadow:0 0 0 4px rgba(10,104,255,.25)}svg{width:1em;height:1em;display:block}.page-orb{position:fixed;z-index:-1;width:250px;height:250px;border-radius:48% 52% 61% 39%/44% 47% 53% 56%;pointer-events:none;opacity:.4}.page-orb--one{left:-85px;top:22vh;background:linear-gradient(145deg,var(--turq),#55D8FF);transform:rotate(22deg)}.page-orb--two{right:-85px;bottom:12vh;background:linear-gradient(145deg,var(--pink),var(--orange));transform:rotate(-16deg)} .brand-splash{position:fixed;inset:0;z-index:4000;display:grid;place-items:center;width:100%;height:100%;height:100dvh;margin:0;padding:0;background:#F6F7EF;overflow:hidden;overscroll-behavior:none;touch-action:none;pointer-events:auto}.brand-splash__media{display:block;width:100%;height:100%}.brand-splash__img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;opacity:0;transform:scale(1);will-change:opacity,transform}.brand-splash.is-playing .brand-splash__img{animation:splashOpen 3s cubic-bezier(.33,0,.2,1) forwards}.brand-splash.is-skipped,.brand-splash.is-hidden{display:none!important}body.splash-lock{overflow:hidden!important;height:100%;height:100dvh;touch-action:none}@keyframes splashOpen{0%{opacity:0;transform:scale(1)}22%{opacity:1;transform:scale(1.035)}62%{opacity:1;transform:scale(1.045)}100%{opacity:0;transform:scale(1.06)}}@media (prefers-reduced-motion:reduce){.brand-splash,.brand-splash.is-playing .brand-splash__img{animation:none!important}}.app-shell{position:relative;width:min(1280px,calc(100% - 28px));min-height:calc(100dvh - 28px);margin:14px auto 26px;border:1px solid rgba(205,227,240,.9);border-radius:30px;overflow:hidden;background:rgba(255,255,255,.96);box-shadow:0 18px 58px rgba(29,75,136,.14)}.app-shell:after{content:"♥ PEQUENOS DESAFIOS. GRANDES CONQUISTAS.";min-height:54px;display:flex;align-items:center;justify-content:center;letter-spacing:.17em;font-size:.66rem;font-weight:900;color:#fff;background:linear-gradient(90deg,#225BFF,#8C46F3 35%,#FF5D93 68%,#FFB650)} .game-header{position:relative;z-index:60;min-height:84px;padding:12px 18px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #DCEAF5;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(246,251,255,.95));backdrop-filter:blur(14px)}.brand-lockup{display:inline-flex;align-items:center;gap:8px;text-decoration:none}.brand-icon-crop{position:relative;width:60px;height:60px;overflow:hidden;border-radius:18px}.brand-icon-crop img{position:absolute;width:110px;height:110px;max-width:none;left:-24px;top:-14px}.brand-wordmark{display:grid;line-height:.88}.brand-wordmark strong{font-size:1.4rem;font-weight:950;letter-spacing:-.05em;background:linear-gradient(90deg,var(--blue),var(--turq) 30%,#EBAE00 51%,var(--coral) 72%,var(--purple));background-clip:text;color:transparent}.brand-wordmark small{margin-top:6px;font-size:.9rem;font-weight:800}.game-title{padding-left:14px;border-left:1px solid #DFE8F1;display:grid;gap:2px}.game-title strong{font-size:clamp(1.55rem,2.2vw,2rem);line-height:1}.game-title small{color:var(--blue2);font-size:.88rem;font-weight:700}.header-spacer{flex:1}.header-claim{max-width:220px;padding:10px 14px;border-radius:26px 26px 8px 26px;background:#EDF7FF;color:var(--blue2);font-size:.84rem;font-weight:800;text-align:center;line-height:1.15;box-shadow:0 4px 14px rgba(25,61,105,.06)}.header-claim strong{color:var(--navy)}.header-actions{display:flex;gap:8px}.icon-button{width:48px;height:48px;min-width:48px;border:1px solid #D6E4EF;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--blue2);cursor:pointer;box-shadow:0 4px 14px rgba(25,61,105,.07);transition:.16s var(--ease);text-decoration:none}.icon-button:hover{transform:translateY(-1px);background:#F4FAFF}.icon-button svg{width:21px;height:21px}.game-only-action{display:none}body.is-playing .game-only-action{display:grid} .config-screen{min-height:calc(100dvh - 120px);padding:clamp(26px,4vw,44px) clamp(14px,4vw,44px);display:grid;place-items:center}.config-card{width:min(980px,100%);padding:clamp(24px,4vw,36px);border:1px solid #D9EAF5;border-radius:34px;background:radial-gradient(circle at 4% 6%,rgba(255,197,26,.14),transparent 10rem),radial-gradient(circle at 96% 4%,rgba(117,71,220,.10),transparent 11rem),rgba(255,255,255,.94);box-shadow:var(--shadow)}.config-heading{text-align:center}.config-kicker{display:inline-block;padding:8px 12px;border-radius:999px;background:#EAF4FF;color:var(--blue2);font-size:.7rem;font-weight:900;letter-spacing:.12em}.config-heading h1{margin:10px 0 5px;font-size:clamp(2rem,5vw,3.4rem);line-height:1;letter-spacing:-.045em}.config-heading p{margin:0;color:var(--muted)}.mode-switch{margin-top:24px;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.mode-card{position:relative;min-height:94px;padding:14px 16px;border:1.5px solid #D8E5EF;border-radius:22px;display:grid;grid-template-columns:52px 1fr 26px;gap:12px;align-items:center;background:linear-gradient(180deg,#fff,#F9FCFF);cursor:pointer;text-align:left;transition:.16s var(--ease)}.mode-card:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(25,61,105,.08)}.mode-card.is-selected{border-color:var(--orange);background:linear-gradient(145deg,#FFF8DA,#FFF0F7 60%,#F4EEFF);box-shadow:inset 0 0 0 1px rgba(255,123,55,.25),0 10px 26px rgba(245,61,139,.08)}.mode-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;font-size:1.5rem;color:#fff}.mode-icon--free{background:linear-gradient(145deg,var(--orange),var(--pink))}.mode-icon--journey{background:linear-gradient(145deg,var(--blue),var(--purple))}.mode-card b{display:block;font-size:1rem}.mode-card small{display:block;margin-top:3px;color:var(--muted);font-size:.78rem;line-height:1.35}.selected-check{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:var(--coral);color:#fff;font-weight:950;opacity:0}.mode-card.is-selected .selected-check{opacity:1}.free-options,.journey-options{margin-top:26px}.section-heading,.journey-heading{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:12px}.section-heading h2,.journey-heading h2{margin:0;font-size:1.3rem}.section-heading span,.journey-heading span{color:var(--muted);font-size:.76rem}.journey-heading>div{display:grid;gap:3px}.journey-heading>strong{padding:7px 11px;border-radius:999px;background:#FFF8DF;color:#9B6800}.difficulty-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.difficulty-card{min-height:112px;padding:14px 10px;border:1.5px solid #DDE8F2;border-radius:22px;display:grid;place-items:center;align-content:center;gap:4px;background:#fff;cursor:pointer;transition:.14s ease}.difficulty-card:hover{transform:translateY(-1px)}.difficulty-card b{font-size:1.1rem}.difficulty-card small{font-size:.72rem;color:var(--text2)}.difficulty-symbol{font-weight:950;letter-spacing:.05em}.difficulty-card--easy{color:var(--green);background:linear-gradient(180deg,#EEFFF5,#F9FFFB)}.difficulty-card--medium{color:var(--blue);background:linear-gradient(180deg,#EDF7FF,#FAFDFF)}.difficulty-card--hard{color:var(--pink);background:linear-gradient(180deg,#FFF0F7,#FFFAFC)}.difficulty-card--expert{color:var(--purple);background:linear-gradient(180deg,#F4EEFF,#FBF9FF)}.difficulty-card.is-selected{border-color:currentColor;box-shadow:inset 0 0 0 2px currentColor,0 8px 22px rgba(25,61,105,.08)}.journey-map{max-height:275px;overflow:auto;padding:2px;display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.journey-phase{min-height:70px;padding:9px;border:1px solid #DDE8F2;border-radius:16px;display:grid;grid-template-columns:34px 1fr;gap:8px;align-items:center;background:#fff;text-align:left;cursor:pointer}.journey-phase .phase-number{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#EAF4FF;color:var(--blue2);font-weight:900}.journey-phase b{display:block;font-size:.72rem}.journey-phase small{color:var(--muted);font-size:.62rem}.journey-phase .phase-stars{grid-column:2;color:#A96F00;font-size:.62rem}.journey-phase.is-selected{border-color:var(--blue);background:#F0F7FF;box-shadow:inset 0 0 0 1px rgba(10,104,255,.2)}.journey-phase.is-complete .phase-number{background:#EAF9F1;color:var(--green)}.journey-phase.is-locked{opacity:.5;cursor:not-allowed}.config-actions{margin-top:26px;display:grid;justify-items:center;gap:10px}.play-now{width:min(620px,100%);min-height:70px;padding:0 24px;border:0;border-radius:24px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;color:#fff;background:linear-gradient(90deg,#FF9C1D 0,#F53D8B 28%,#8C46F3 57%,#0A68FF 100%);box-shadow:0 16px 34px rgba(95,70,230,.24);font-size:1.22rem;font-weight:950;cursor:pointer;transition:.16s var(--ease)}.play-now:hover{transform:translateY(-2px);box-shadow:0 19px 38px rgba(95,70,230,.28)}.play-now svg{width:28px;height:28px}.play-now b{font-size:2rem}.continue-button{min-height:46px;padding:0 18px;border:1.5px solid #CFE0F0;border-radius:15px;background:#fff;color:var(--blue2);font-weight:850;display:inline-flex;align-items:center;gap:7px;cursor:pointer}.continue-button svg{width:17px;height:17px}.howto-link{border:0;background:transparent;color:var(--blue2);font-weight:850;display:inline-flex;align-items:center;gap:7px;cursor:pointer}.howto-link svg{width:18px;height:18px}.save-note{margin:10px 0 0;text-align:center;color:var(--muted);font-size:.7rem} .game-screen{padding:18px 18px 30px}.session-bar{width:min(1140px,100%);min-height:62px;margin:0 auto 10px;padding:8px 10px;border:1px solid #E1EAF2;border-radius:20px;display:flex;align-items:center;gap:10px;background:#FAFCFE;box-shadow:0 4px 14px rgba(25,61,105,.05)}.back-button{width:44px;height:44px;min-width:44px;border:1px solid #DDE8F2;border-radius:14px;display:grid;place-items:center;background:#fff;color:var(--blue2);font-size:1.7rem;cursor:pointer}.session-main{display:grid;min-width:0}.session-main>span{color:var(--blue2);font-size:.61rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.session-main strong{font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.session-main small{margin-top:1px;color:var(--muted);font-size:.68rem}.stage-chip{margin-left:auto;padding:7px 10px;border-radius:999px;background:#F4EEFF;color:var(--purple);font-size:.67rem;font-weight:850}.coach-strip{width:min(960px,100%);min-height:46px;margin:0 auto 12px;padding:8px 12px;border:1px solid #DCE9F4;border-radius:16px;display:flex;align-items:center;gap:9px;background:linear-gradient(90deg,#F5FBFF,#FFF9FE)}.coach-dot{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:#F0EAFF;color:var(--purple);font-weight:950}.coach-strip p{margin:0;color:var(--text2);font-size:.76rem}.coach-strip.is-hint{background:#FFFBEA;border-color:#F1D57C}.coach-strip.is-success{background:#F2FBF7;border-color:#BFE5D4}.coach-strip.is-error{background:#FFF2F4;border-color:#F2C8CF}.game-layout{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:18px;align-items:start}.board-column{min-width:0}.status-row{margin-bottom:14px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.status-card{min-height:88px;padding:13px;border:1px solid #DDE8F1;border-radius:22px;display:flex;align-items:center;gap:12px;background:#fff}.status-card>svg{width:28px;height:28px}.status-card span{display:grid}.status-card small{font-size:.78rem;color:var(--text2)}.status-card strong{margin-top:2px;font-size:1.55rem;font-variant-numeric:tabular-nums}.status-card--pegs{background:linear-gradient(180deg,#EEFAEF,#FAFFFB);color:var(--green)}.status-card--moves{background:linear-gradient(180deg,#EEF7FF,#FAFDFF);color:var(--blue)}.status-card--time{background:linear-gradient(180deg,#F5F0FF,#FCFAFF);color:var(--purple)}.status-card--hints{background:linear-gradient(180deg,#FFF8DA,#FFFCEF);color:#B97A00}.board-card{width:min(100%,700px);margin:0 auto;padding:clamp(14px,2.2vw,22px);border-radius:32px;background:radial-gradient(circle at 15% 12%,rgba(255,255,255,.8),transparent 8rem),linear-gradient(145deg,#D8F5FF,#E9F0FF 45%,#F7E8FF 78%,#FFF1DA);box-shadow:0 22px 50px rgba(21,72,132,.13);border:1px solid rgba(10,104,255,.12)}.board{width:100%;aspect-ratio:1;display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr);gap:clamp(5px,1vw,9px)}.cell{position:relative;border-radius:50%;display:grid;place-items:center;min-width:0;min-height:0}.cell.invalid{visibility:hidden}.cell.socket{background:radial-gradient(circle at 40% 35%,#CFE8F8,#9FC6E6 72%);box-shadow:inset 0 5px 9px rgba(17,25,87,.18),inset 0 -2px 2px rgba(255,255,255,.8)}.cell.socket.has-peg,.cell.socket.empty.movable{cursor:pointer}.peg{width:78%;height:78%;border-radius:50%;background:radial-gradient(circle at 32% 25%,#FFF2A0 0,#FFC51A 30%,#FF7B37 62%,#F53D8B 100%);box-shadow:0 7px 13px rgba(245,61,139,.22),inset 0 3px 4px rgba(255,255,255,.7),inset 0 -5px 9px rgba(164,54,81,.18);transition:.14s var(--ease)}.cell.has-peg:hover .peg{transform:scale(1.06)}.cell.selected .peg{transform:scale(1.1);box-shadow:0 0 0 4px #fff,0 0 0 7px var(--blue),0 8px 18px rgba(10,104,255,.22),inset 0 3px 4px rgba(255,255,255,.7)}.cell.socket.empty.movable{animation:targetPulse 1.3s ease-in-out infinite;background:radial-gradient(circle,#E9FBF4,#C8F1DD)}.cell.socket.hint-from{box-shadow:0 0 0 4px #FFF7C4,0 0 0 8px var(--yellow),inset 0 5px 9px rgba(17,25,87,.18)}.cell.socket.hint-to{box-shadow:0 0 0 4px #EAF8F1,0 0 0 8px var(--green),inset 0 5px 9px rgba(17,25,87,.18)}.cell:focus-visible,.cell.kb-focus{outline:3px solid var(--blue);outline-offset:3px;box-shadow:0 0 0 4px rgba(10,104,255,.18)}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.peg.flying{position:fixed;z-index:2500;pointer-events:none;border-radius:50%;background:radial-gradient(circle at 32% 25%,#FFF2A0 0,#FFC51A 30%,#FF7B37 62%,#F53D8B 100%);box-shadow:0 12px 22px rgba(17,25,87,.22);animation:jumpArc .42s cubic-bezier(.3,0,.2,1) forwards}.peg.captured{animation:captureFade .32s ease-out forwards}@keyframes targetPulse{50%{box-shadow:0 0 0 5px rgba(25,185,110,.28),inset 0 5px 9px rgba(17,25,87,.14)}}@keyframes jumpArc{0%{transform:translate(0,0) scale(1)}45%{transform:translate(var(--mid-x),calc(var(--mid-y) - var(--arc-height))) scale(1.16)}100%{transform:translate(var(--dx),var(--dy)) scale(1)}}@keyframes captureFade{to{transform:scale(.15);opacity:0}}.control-column{position:sticky;top:16px;display:grid;gap:12px}.side-message{padding:16px 18px;border:1px solid #DDE8F1;border-radius:24px;background:linear-gradient(145deg,#EAF4FF,#F7FBFF);display:grid;grid-template-columns:1fr 74px;gap:8px;align-items:center}.side-message>div{display:grid;gap:4px}.side-message strong{font-size:1.05rem}.side-message span{color:var(--text2);font-size:.8rem;line-height:1.35}.side-mascot{position:relative!important;width:74px;height:62px;overflow:hidden}.side-mascot img{position:absolute;width:122px;max-width:none;left:-10px;top:-4px}.action-card{padding:20px;border:1px solid #DFE9F2;border-radius:24px;background:#fff;box-shadow:0 4px 14px rgba(25,61,105,.05)}.action-kicker{display:block;color:var(--blue2);font-size:.61rem;font-weight:900;letter-spacing:.1em}.action-card h2{margin:5px 0 6px;font-size:1.2rem}.action-card p{margin:0 0 15px;color:var(--muted);font-size:.78rem;line-height:1.45}.action-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.tool-button{min-height:66px;border:1px solid #DCE7F0;border-radius:16px;display:grid;place-items:center;align-content:center;gap:4px;background:#FAFCFE;cursor:pointer;font-size:.74rem;font-weight:850}.tool-button svg{width:22px;height:22px}.tool-button--undo{color:var(--purple);background:#F7F4FF}.tool-button--hint{color:#9A6500;background:#FFF9E4}.tool-button--restart{color:var(--coral);background:#FFF3F4}.tool-button--help{color:var(--blue2);background:#F1F8FF}.tool-button:disabled{opacity:.35;cursor:not-allowed}.best-card{min-height:78px;padding:13px;border:1px solid #DFE9F2;border-radius:20px;display:grid;align-content:center;text-align:center;background:#FAFCFE}.best-card span,.best-card small{color:var(--muted);font-size:.65rem}.best-card strong{margin:3px 0;font-size:1.08rem} .modal-overlay{position:fixed;inset:0;z-index:2000;padding:20px;display:grid;place-items:center;overflow:auto;background:rgba(12,23,62,.56);backdrop-filter:blur(8px)}.modal-card{position:relative;width:min(580px,100%);max-height:90vh;overflow:auto;padding:32px;border:1px solid rgba(255,255,255,.7);border-radius:30px;background:radial-gradient(circle at 8% 5%,rgba(245,61,139,.12),transparent 12rem),radial-gradient(circle at 92% 3%,rgba(10,104,255,.12),transparent 12rem),#fff;box-shadow:0 30px 80px rgba(25,61,105,.18);text-align:center;animation:modalIn .2s var(--ease) both}.modal-close{position:absolute;right:14px;top:14px;width:42px;height:42px;border:0;border-radius:50%;background:#F1F7FC;color:var(--blue2);font-size:1.55rem;cursor:pointer}.modal-kicker{display:inline-block;margin-bottom:8px;color:var(--blue2);font-size:.7rem;font-weight:900;letter-spacing:.12em}.modal-card h2{margin:0;font-size:clamp(1.7rem,4vw,2.2rem);letter-spacing:-.035em}.modal-card>p{color:var(--text2)}.tutorial-steps{margin:18px 0;padding:0;display:grid;gap:8px;list-style:none;text-align:left}.tutorial-steps li{padding:11px;border:1px solid #E1EAF2;border-radius:15px;display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;background:#FAFCFE}.tutorial-steps li>span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#EAF5FF;color:var(--blue2);font-weight:950}.tutorial-steps strong{display:block;font-size:.85rem}.tutorial-steps small{display:block;margin-top:2px;color:var(--muted);font-size:.72rem;line-height:1.35}.tutorial-tip{padding:11px 13px;border-radius:14px;background:#FFF8DF;color:#755000!important;font-size:.76rem}.primary-button,.secondary-button,.text-button{min-height:52px;padding:0 18px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:850;cursor:pointer;text-decoration:none}.primary-button{border:0;color:#fff;background:linear-gradient(135deg,var(--blue),var(--purple));box-shadow:0 12px 26px rgba(10,104,255,.2)}.secondary-button{border:1.5px solid #CFE0F0;background:#fff;color:var(--blue2)}.text-button{border:0;background:transparent;color:var(--blue2)}.modal-actions{display:grid;gap:8px}.modal-actions--help{margin-top:16px}.primary-button--full,.secondary-button--full{width:100%}.help-blog-cta{background:linear-gradient(90deg,#FF9C1D 0,#F53D8B 28%,#8C46F3 57%,#0A68FF 100%);box-shadow:0 12px 26px rgba(95,70,230,.22);font-weight:950}.help-blog-cta:hover{transform:translateY(-1px);box-shadow:0 16px 30px rgba(95,70,230,.26)}.confirm-actions,.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.result-card{width:min(690px,100%)}.result-mascot{position:relative;width:125px;height:84px;margin:0 auto -4px;overflow:hidden}.result-mascot img{position:absolute;width:205px;max-width:none;left:-2px;top:-7px}.result-banner{margin:16px 0 12px;padding:12px 14px;border-radius:16px;background:linear-gradient(90deg,#EEF7FF,#F6F2FF,#FFF5F8);font-weight:850}.result-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.result-stats>div{min-height:82px;padding:8px;border:1px solid #E0E9F1;border-radius:16px;display:grid;align-content:center;background:#FAFCFE}.result-stats>div:nth-child(1){background:#F1FAF5}.result-stats>div:nth-child(2){background:#EFF7FF}.result-stats>div:nth-child(3){background:#F6F1FF}.result-stats>div:nth-child(4){background:#FFF8DF}.result-stats small{color:var(--muted);font-size:.66rem}.result-stats strong{margin-top:3px;font-size:1.05rem}.result-actions{margin-top:14px}.result-brand-line{margin:14px 0 0!important;color:#8793A8!important;font-size:.62rem!important;font-weight:750}.result-brand-line span{color:var(--pink)}.toast{position:fixed;z-index:2500;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:min(92vw,560px);padding:12px 16px;border-radius:14px;background:var(--navy);color:#fff;box-shadow:var(--shadow);font-size:.88rem;font-weight:750;text-align:center}.noscript-note{margin:16px auto;padding:12px;width:min(900px,calc(100% - 24px));border-radius:12px;background:#FFF7D9;color:#815900;text-align:center}@keyframes modalIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}} @media(max-width:980px){.header-claim{display:none}.game-layout{grid-template-columns:1fr;max-width:760px}.control-column{position:static;width:min(100%,720px);margin:0 auto}.board-column{width:min(100%,720px);margin:0 auto}.action-grid{grid-template-columns:repeat(4,1fr)}.tool-button{min-height:60px}.journey-map{grid-template-columns:repeat(3,1fr)}} @media(max-width:760px){.app-shell{width:calc(100% - 16px);margin:8px auto 20px;border-radius:24px}.game-header{min-height:66px;padding:8px 10px}.brand-icon-crop{width:46px;height:46px}.brand-icon-crop img{width:84px;height:84px;left:-17px;top:-10px}.brand-wordmark strong{font-size:1rem}.brand-wordmark small{font-size:.67rem}.game-title strong{font-size:1.32rem}.game-title small{display:none}.header-actions{gap:5px}.icon-button{width:41px;height:41px;min-width:41px}.config-screen{padding:24px 12px 30px}.config-card{padding:22px 14px;border-radius:26px}.mode-switch{gap:8px}.mode-card{grid-template-columns:42px 1fr 22px;min-height:84px;padding:10px;border-radius:18px}.mode-icon{width:42px;height:42px}.difficulty-grid{grid-template-columns:repeat(2,1fr)}.journey-map{grid-template-columns:repeat(2,1fr)}.game-screen{padding:8px 8px 20px}.status-row{grid-template-columns:repeat(2,1fr);gap:7px}.status-card{min-height:70px;border-radius:17px}.status-card strong{font-size:1.25rem}.board-card{padding:8px;border-radius:18px}.action-grid{grid-template-columns:repeat(2,1fr)}.confirm-actions,.result-actions{grid-template-columns:1fr}.result-stats{grid-template-columns:repeat(2,1fr)}} @media(max-width:520px){body{background:linear-gradient(180deg,#BCEAFF 0,#EAF7FF 20%,#F7FBFF 55%,#F7FAFE)}.page-orb{display:none}.app-shell{width:100%;min-height:100dvh;margin:0;border:0;border-radius:0;box-shadow:none;overflow:visible}.app-shell:after{min-height:44px;font-size:.52rem;letter-spacing:.11em}.game-header{position:sticky;top:0;z-index:100}.brand-wordmark{display:none}.game-title{padding-left:7px}.game-title strong{font-size:1.12rem}.header-actions{margin-left:auto}.config-heading h1{font-size:2rem}.config-heading p{font-size:.82rem}.mode-switch{grid-template-columns:1fr}.mode-card{min-height:70px}.mode-card small{font-size:.68rem}.section-heading{align-items:start}.section-heading span{max-width:45%;text-align:right}.difficulty-card{min-height:84px;border-radius:17px}.difficulty-card b{font-size:.96rem}.play-now{min-height:62px;border-radius:20px;font-size:1rem}.save-note{font-size:.62rem}.session-bar{min-height:52px;padding:6px;border-radius:14px}.session-main>span{font-size:.53rem}.session-main strong{font-size:.8rem}.session-main small{display:none}.stage-chip{font-size:.55rem;padding:5px 7px}.coach-strip{min-height:40px;padding:6px 9px;border-radius:12px}.coach-strip p{font-size:.67rem}.status-card{min-height:62px;padding:9px}.status-card>svg{width:21px;height:21px}.status-card small{font-size:.64rem}.status-card strong{font-size:1.05rem}.board{gap:4px}.board-card{padding:6px}.side-message{grid-template-columns:1fr 56px;padding:12px 13px;border-radius:18px}.side-message strong{font-size:.9rem}.side-message span{font-size:.7rem}.side-mascot{width:56px;height:47px}.side-mascot img{width:92px;left:-8px;top:-3px}.action-card{padding:14px;border-radius:18px}.action-card h2{font-size:1rem}.action-card p{font-size:.7rem}.tool-button{min-height:52px;border-radius:12px;font-size:.65rem}.best-card{min-height:62px;border-radius:16px}.modal-overlay{padding:10px;align-items:end}.modal-card{width:100%;max-height:88dvh;padding:26px 14px 16px;border-radius:24px 24px 18px 18px}.result-stats>div{min-height:70px}} @media(max-width:360px){.difficulty-grid,.journey-map{grid-template-columns:1fr 1fr}.game-title{display:none}.status-row{gap:5px}.status-card{padding:7px}.tool-button{font-size:.6rem}} @media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.cell.socket.empty.movable{animation:none!important}} .howto-link,#configHelpBtn.howto-link{min-height:44px;padding:10px 8px;line-height:1.2;justify-content:center} .howto-link:focus-visible,#configHelpBtn.howto-link:focus-visible{box-shadow:0 0 0 4px rgba(10,104,255,.25)} /* UI limpa: sem header/barra lateral na partida; tempo alinhado à engrenagem */ body.is-playing .game-header{display:none!important} body.is-playing .app-shell{min-height:100dvh;margin:0;border-radius:0;border:0;width:100%;box-shadow:none} body.is-playing .app-shell:after{display:none} .game-screen{padding:max(8px,env(safe-area-inset-top,0px)) 16px max(20px,env(safe-area-inset-bottom,0px))} .game-layout{max-width:720px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:0;align-items:start} .board-column{width:100%;min-width:0;margin:0 auto} .top-time-row{ display:flex;align-items:center;justify-content:flex-start; min-height:var(--nb-gs-safe,60px); margin:0 0 10px; padding-right:calc(var(--nb-gs-safe,60px) + 12px); box-sizing:border-box } .top-time-row .status-card--time{ min-height:48px;padding:8px 14px;border-radius:16px;gap:10px; box-shadow:0 4px 14px rgba(25,61,105,.06) } .top-time-row .status-card--time>svg{width:22px;height:22px} .top-time-row .status-card--time strong{font-size:1.25rem;margin-top:0} .top-time-row .status-card--time small{font-size:.7rem} .status-row--below{ margin:14px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:10px } .status-row--below .status-card{min-height:72px} @media(max-width:760px){ .game-screen{padding:max(6px,env(safe-area-inset-top,0px)) 10px 16px} .top-time-row{min-height:52px;padding-right:calc(52px + 10px);margin-bottom:8px} .top-time-row .status-card--time{min-height:44px;padding:6px 12px} .top-time-row .status-card--time strong{font-size:1.1rem} .status-row--below{margin-top:10px;gap:8px} .status-row--below .status-card{min-height:62px} } @media(max-width:520px){ .top-time-row{padding-right:calc(52px + 8px)} .status-row--below .status-card{min-height:56px;padding:8px 10px;border-radius:14px} } /* Partida: tabuleiro de madeira clara sobre feltro verde-sálvia */ body.is-playing{ --play-forest:#1f4a3a;--play-forest-soft:#3b6252;--play-cream:#f1efe3; --play-ring:rgba(36,84,62,.8);--play-hint:rgba(184,128,44,.95); --play-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='w'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.0035 .06' numOctaves='4' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .31 0 0 0 0 .14 1 0 0 0 -.44'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23w)'/%3E%3C/svg%3E"); --play-pores:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .3 0 0 0 0 .16 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); --play-felt:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .14 0 0 0 0 .1 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E"); --play-cross-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'%3E%3Cpath fill='%23fff' d='M320 0H680A52 52 0 0 1 732 52V232A36 36 0 0 0 768 268H948A52 52 0 0 1 1000 320V680A52 52 0 0 1 948 732H768A36 36 0 0 0 732 768V948A52 52 0 0 1 680 1000H320A52 52 0 0 1 268 948V768A36 36 0 0 0 232 732H52A52 52 0 0 1 0 680V320A52 52 0 0 1 52 268H232A36 36 0 0 0 268 232V52A52 52 0 0 1 320 0Z'/%3E%3C/svg%3E"); --play-cross-bevel:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000' preserveAspectRatio='none'%3E%3ClinearGradient id='b' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23fffaf0' stop-opacity='.6'/%3E%3Cstop offset='.55' stop-color='%23fffaf0' stop-opacity='.2'/%3E%3Cstop offset='1' stop-color='%23875b33' stop-opacity='.45'/%3E%3C/linearGradient%3E%3Cpath fill='none' stroke='url(%23b)' stroke-width='9' d='M320 0H680A52 52 0 0 1 732 52V232A36 36 0 0 0 768 268H948A52 52 0 0 1 1000 320V680A52 52 0 0 1 948 732H768A36 36 0 0 0 732 768V948A52 52 0 0 1 680 1000H320A52 52 0 0 1 268 948V768A36 36 0 0 0 232 732H52A52 52 0 0 1 0 680V320A52 52 0 0 1 52 268H232A36 36 0 0 0 268 232V52A52 52 0 0 1 320 0Z'/%3E%3C/svg%3E"); --play-board-size:min(96vw,calc(100dvh - 148px)); background:var(--play-cream)!important } body.is-playing .page-orb{display:none} body.is-playing .app-shell{background:transparent!important;overflow:hidden} body.is-playing .game-screen{ min-height:100dvh;display:flex;flex-direction:column;justify-content:center; padding:max(6px,env(safe-area-inset-top,0px)) max(10px,env(safe-area-inset-right,0px)) max(10px,env(safe-area-inset-bottom,0px)) max(10px,env(safe-area-inset-left,0px)); box-sizing:border-box } body.is-playing .game-layout{width:100%;max-width:none;margin:0 auto;flex:1;align-content:center} body.is-playing .board-column{ width:100%;max-width:var(--play-board-size);margin:0 auto; display:flex;flex-direction:column;gap:clamp(8px,1.6vh,14px) } body.is-playing .play-hud{ display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:clamp(6px,2vw,12px); min-height:var(--nb-gs-safe,56px);padding-right:calc(var(--nb-gs-safe,56px) + 6px);color:var(--play-forest) } body.is-playing .play-hud__stat{display:flex;align-items:center;justify-content:center;gap:9px;min-width:0} body.is-playing .play-hud__stat>svg{width:22px;height:22px;color:var(--play-forest-soft)} body.is-playing .play-hud__copy{display:grid;gap:1px} body.is-playing .play-hud__label{font-size:clamp(.64rem,2.8vw,.76rem);font-weight:600;color:var(--play-forest-soft)} body.is-playing .play-hud__value{font-size:clamp(1.1rem,4.4vw,1.45rem);line-height:1.1;font-weight:800;font-variant-numeric:tabular-nums;color:var(--play-forest);font-family:var(--font)} body.is-playing .play-hud__rule{width:1px;height:34px;background:rgba(31,74,58,.16);justify-self:center} /* Feltro com costura */ body.is-playing .board-stage{ position:relative;width:100%;aspect-ratio:1;margin:0 auto;border-radius:50%; background-color:#48614f; background-image:var(--play-felt),radial-gradient(circle at 36% 28%,#55705d 0%,#4a6351 42%,#435b4a 74%,#3c5343 100%); background-size:140px 140px,auto; background-blend-mode:soft-light,normal; box-shadow: 0 24px 40px -14px rgba(30,46,35,.42), 0 4px 10px rgba(30,46,35,.12), inset 0 0 0 1px rgba(28,46,34,.35), inset 0 2px 1px rgba(255,255,255,.07), inset 0 -4px 10px rgba(0,0,0,.16) } body.is-playing .board-stage::before{ content:"";position:absolute;inset:2.4%;border-radius:50%;pointer-events:none;z-index:0; border:1.5px dashed rgba(222,226,204,.4) } body.is-playing .board-stage::after{content:none} /* Tabuleiro em cruz, madeira clara */ body.is-playing .board-card--play{ position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%); width:78%;aspect-ratio:1;margin:0;padding:0!important; border:0!important;border-radius:0!important;box-shadow:none!important; background-color:#e2c397; background-image: var(--play-grain), var(--play-pores), radial-gradient(ellipse 85% 65% at 32% 22%,rgba(255,247,230,.22),transparent 62%), linear-gradient(180deg,#e7c99d 0%,#e0bf90 48%,#d6b080 100%); background-size:100% 100%,220px 220px,auto,auto; -webkit-mask-image:var(--play-cross-mask);mask-image:var(--play-cross-mask); -webkit-mask-size:100% 100%;mask-size:100% 100%; -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat; -webkit-mask-position:center;mask-position:center; filter: drop-shadow(0 2px 0 #b98d5b) drop-shadow(0 1px 0 #a17447) drop-shadow(0 10px 12px rgba(22,38,28,.32)) } body.is-playing .board-card--play::after{ content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background:var(--play-cross-bevel) center/100% 100% no-repeat } body.is-playing .board-card--play .board{ position:absolute!important;z-index:1;left:3%!important;top:3%!important; width:94%!important;height:94%!important;aspect-ratio:auto!important; margin:0!important;padding:0!important;gap:0!important;border-radius:0!important; background:transparent!important;box-shadow:none!important } body.is-playing .board-card--play .cell.invalid{visibility:hidden;pointer-events:none} /* Casa: o buraco é sempre desenhado, com ou sem peça */ body.is-playing .board-card--play .cell.socket{ overflow:visible;background:none;box-shadow:none;animation:none;outline:none;cursor:default } body.is-playing .board-card--play .cell.socket.has-peg, body.is-playing .board-card--play .cell.socket.empty.movable{cursor:pointer} body.is-playing .board-card--play .cell.socket::before{ content:"";position:absolute;inset:11%;border-radius:50%;pointer-events:none;z-index:0; background:radial-gradient(circle at 50% 68%,#c39767 0%,#b08454 38%,#94693f 72%,#7b532e 100%); box-shadow: inset 0 5px 6px -1px rgba(64,36,14,.66), inset 0 -2px 2px rgba(255,232,196,.32), 0 1px 0 .5px rgba(255,246,226,.7), 0 -1px 0 .5px rgba(132,92,52,.3) } body.is-playing .board-card--play .cell.socket::after{ content:"";position:absolute;inset:5%;border-radius:50%;pointer-events:none;z-index:1; opacity:0;transition:opacity .18s var(--ease); box-shadow:0 0 0 2px var(--play-ring) } body.is-playing .board-card--play .cell.socket.selected::after{opacity:1} body.is-playing .board-card--play .cell.socket.empty.movable::after{ opacity:1; background:radial-gradient(circle,rgba(36,84,62,.42) 0 17%,transparent 19%); box-shadow:0 0 0 2px rgba(36,84,62,.55); animation:playTargetPulse 1.6s ease-in-out infinite } body.is-playing .board-card--play .cell.socket.hint-from::after{opacity:1;box-shadow:0 0 0 2px var(--play-hint)} body.is-playing .board-card--play .cell.socket.hint-to::after{ opacity:1; background:radial-gradient(circle,rgba(36,84,62,.42) 0 17%,transparent 19%); box-shadow:0 0 0 2px var(--play-ring) } body.is-playing .board-card--play .cell.socket:focus-visible::after, body.is-playing .board-card--play .cell.socket.kb-focus:focus-visible::after{ opacity:1;box-shadow:0 0 0 2px rgba(31,74,58,.95),0 0 0 4px rgba(255,250,238,.7) } @keyframes playTargetPulse{50%{opacity:.55}} /* Peças: esferas de mogno */ body.is-playing .board-card--play .peg{ position:relative;z-index:2;width:70%;height:70%;margin:0;border-radius:50%; background: radial-gradient(circle at 34% 27%,rgba(255,220,198,.55) 0,rgba(255,220,198,0) 21%), radial-gradient(circle at 52% 100%,rgba(214,132,92,.3) 0,rgba(214,132,92,0) 42%), radial-gradient(circle at 40% 34%,#aa6139 0%,#8e4828 30%,#6c321a 60%,#47210f 86%,#36190b 100%); box-shadow:0 2px 2px rgba(45,22,8,.45),2px 5px 7px -1px rgba(45,22,8,.32); transition:transform .18s var(--ease),box-shadow .18s var(--ease) } body.is-playing .board-card--play .cell.has-peg:hover .peg{transform:none} @media(hover:hover){ body.is-playing .board-card--play .cell.has-peg:hover .peg{transform:translateY(-2px)} } body.is-playing .board-card--play .cell.socket.has-peg.selected .peg{ transform:translateY(-9%) scale(1.06); box-shadow:0 5px 5px -2px rgba(45,22,8,.35),3px 13px 14px -4px rgba(45,22,8,.42) } body.is-playing .board-card--play .peg.captured{animation:pegSink .3s ease-in forwards} body.is-playing .board-card--play .peg.landed{animation:pegSettle .26s var(--ease)} @keyframes pegSink{to{transform:scale(.55);opacity:0}} @keyframes pegSettle{0%{transform:translateY(-8%) scale(1.05)}60%{transform:translateY(1%) scale(.99)}100%{transform:none}} /* Peça em voo: fixed obrigatório — senão entra no fluxo e empurra o tabuleiro */ body.is-playing .peg.flying{ position:fixed!important;z-index:2500!important;pointer-events:none;margin:0!important; border-radius:50%; background: radial-gradient(circle at 34% 27%,rgba(255,220,198,.55) 0,rgba(255,220,198,0) 21%), radial-gradient(circle at 40% 34%,#aa6139 0%,#8e4828 30%,#6c321a 60%,#47210f 86%,#36190b 100%); box-shadow:4px 14px 16px -4px rgba(30,15,5,.4); animation:jumpArc .42s cubic-bezier(.3,0,.2,1) forwards } body.is-playing .play-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:420px;width:100%;margin:0 auto} body.is-playing .play-action-btn{ min-height:50px;padding:10px 16px;border:1px solid rgba(31,74,58,.16);border-radius:999px; display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#fff;color:var(--play-forest); font-size:.95rem;font-weight:700;cursor:pointer;box-shadow:0 4px 12px rgba(30,46,35,.07); transition:background .16s var(--ease),box-shadow .16s var(--ease) } body.is-playing .play-action-btn svg{width:18px;height:18px} body.is-playing .play-action-btn:hover:not(:disabled){background:#fbfaf5;box-shadow:0 6px 16px rgba(30,46,35,.1)} body.is-playing .play-action-btn:disabled{opacity:.45;cursor:not-allowed} @media(max-width:520px){ body.is-playing{--play-board-size:min(100vw,calc(100dvh - 118px))} body.is-playing .play-hud{min-height:48px;padding-right:calc(52px + 4px)} body.is-playing .board-stage{ aspect-ratio:7/8; width:100%; max-height:min(74dvh,calc(100vw * 1.12)); border-radius:28px } body.is-playing .board-stage::before{border-radius:24px} body.is-playing .board-card--play{ width:94%; height:90%; aspect-ratio:auto; transform:translate(-50%,-50%) scale(1.04) } body.is-playing .board-card--play .board{width:96%!important;height:96%!important;top:2%!important;left:2%!important} body.is-playing .board-card--play .cell.socket::after{inset:4%} } @media(min-width:900px){body.is-playing{--play-board-size:min(720px,calc(100dvh - 160px))}} @media(prefers-reduced-motion:reduce){ body.is-playing .board-card--play .cell.socket.empty.movable::after{animation:none!important} body.is-playing .board-card--play .peg{transition:none!important} } /* —— Tela inicial (mock Resta 1) —— */ :root{ --home-bg:#F8F9F4;--home-forest:#1D4D3F;--home-forest-deep:#163d32;--home-forest-soft:#3d6256; --home-gold:#F9B824;--home-card:#fff;--home-shadow:0 14px 40px rgba(29,77,63,.1);--home-font:"Nunito",Inter,Aptos,"Segoe UI",Roboto,Helvetica,Arial,sans-serif } body:not(.is-playing){ background:var(--home-bg)!important;font-family:var(--home-font) } body:not(.is-playing) .page-orb{display:none!important} body:not(.is-playing) .app-shell{ width:100%;max-width:none;min-height:100dvh;margin:0;border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible } body:not(.is-playing) .app-shell:after{display:none!important} body:not(.is-playing) .game-header{display:none!important} body:not(.is-playing) .nb-gs-gear{background:var(--home-forest);box-shadow:0 8px 22px rgba(29,77,63,.28)} body:not(.is-playing) .nb-gs-gear:hover{background:var(--home-forest-deep)} .home-screen.config-screen{ min-height:100dvh;padding:max(20px,env(safe-area-inset-top,0px)) max(20px,env(safe-area-inset-right,0px)) max(28px,env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px)); display:flex;align-items:center;justify-content:center } .home-shell{width:min(920px,100%);margin:0 auto} .home-hero{text-align:center;margin-bottom:clamp(28px,5vw,44px);padding-top:clamp(8px,2vh,24px)} .home-logo{margin:0;display:flex;justify-content:center;line-height:0} .home-logo picture,.home-logo__img{display:block;width:min(480px,82vw);max-width:100%;height:auto} .home-tagline{margin:12px 0 0;color:var(--home-forest-soft);font-size:clamp(.95rem,2.6vw,1.12rem);font-weight:700;line-height:1.45} .home-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,3vw,24px);align-items:stretch} .home-card{ display:flex;flex-direction:column;align-items:center;text-align:center;padding:clamp(22px,3.5vw,32px) clamp(18px,3vw,28px) clamp(20px,3vw,28px); border-radius:24px;background:var(--home-card);box-shadow:var(--home-shadow);border:1px solid rgba(29,77,63,.06) } .home-card__visual{width:min(168px,52vw);aspect-ratio:1;margin:0 auto 8px;display:grid;place-items:center} .home-card__visual picture,.home-card__visual img{display:block;width:100%;height:100%;object-fit:contain} .home-card__title{margin:6px 0 6px;font-size:clamp(1.35rem,3.5vw,1.65rem);font-weight:900;color:var(--home-forest);letter-spacing:-.02em} .home-card__desc{margin:0 0 18px;max-width:22em;color:var(--home-forest-soft);font-size:clamp(.88rem,2.4vw,1rem);font-weight:600;line-height:1.45} .home-card__cta{ width:100%;min-height:52px;margin-top:auto;padding:0 18px;border:0;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:10px; background:var(--home-forest);color:#fff;font-family:inherit;font-size:clamp(.92rem,2.5vw,1.02rem);font-weight:800;cursor:pointer; box-shadow:0 10px 24px rgba(29,77,63,.22);transition:transform .16s var(--ease),box-shadow .16s var(--ease),background .16s var(--ease) } .home-card__cta svg{width:18px;height:18px;flex-shrink:0} .home-card__cta:hover{background:var(--home-forest-deep);transform:translateY(-1px);box-shadow:0 14px 28px rgba(29,77,63,.26)} .home-secondary{margin-top:clamp(20px,4vw,32px);display:flex;flex-direction:column;align-items:center;gap:10px} .home-continue{ min-height:46px;padding:0 20px;border:1.5px solid rgba(29,77,63,.18);border-radius:999px;background:#fff;color:var(--home-forest); font-family:inherit;font-weight:800;display:inline-flex;align-items:center;gap:8px;cursor:pointer;box-shadow:0 6px 18px rgba(29,77,63,.08) } .home-continue svg{width:16px;height:16px} .home-help-link{border:0;background:transparent;color:var(--home-forest-soft);font-family:inherit;font-weight:700;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:.9rem} .home-help-link svg{width:18px;height:18px} .home-panel{width:min(640px,100%);margin:0 auto;padding:clamp(8px,2vw,16px) 0} .home-back{ margin-bottom:16px;border:0;background:transparent;color:var(--home-forest);font-family:inherit;font-size:.92rem;font-weight:800;cursor:pointer;padding:8px 4px } .home-panel__head{text-align:center;margin-bottom:18px} .home-panel__head h2{margin:0 0 6px;font-size:clamp(1.45rem,4vw,1.85rem);color:var(--home-forest);letter-spacing:-.02em} .home-panel__head p{margin:0;color:var(--home-forest-soft);font-weight:600;font-size:.92rem} .home-panel__play{ width:100%;min-height:54px;margin-top:20px;border:0;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:10px; background:var(--home-forest);color:#fff;font-family:inherit;font-size:1.02rem;font-weight:800;cursor:pointer;box-shadow:0 10px 24px rgba(29,77,63,.22) } .home-panel__play svg{width:18px;height:18px} .home-journey-head.journey-heading{margin-bottom:14px} .home-journey-head h2{color:var(--home-forest)} .home-journey-head>strong{background:#FFF4D6;color:#8A6200} .home-journey-map.journey-map{max-height:none;grid-template-columns:repeat(3,1fr);gap:10px} .home-journey-map .journey-phase{border-color:rgba(29,77,63,.12);border-radius:14px} .home-journey-map .journey-phase.is-selected{border-color:var(--home-forest);background:#F3FAF6;box-shadow:inset 0 0 0 1px rgba(29,77,63,.18)} .home-journey-map .journey-phase .phase-number{background:#E8F3EE;color:var(--home-forest)} @media(max-width:720px){ .home-cards{grid-template-columns:1fr;max-width:420px;margin:0 auto} .home-card__visual{width:min(140px,44vw)} .home-journey-map.journey-map{grid-template-columns:repeat(2,1fr)} } @media(min-width:721px) and (max-width:1024px){ .home-shell{width:min(780px,100%)} .home-cards{gap:18px} } @media(min-width:1025px){ .home-shell{width:min(920px,100%)} }