:root{
  --bg:#07111f;--bg2:#0a1526;--surface:#0f1b2d;--surface2:#121f34;--surface3:#17243a;
  --line:#243953;--line-soft:rgba(142,174,213,.14);--text:#f6efe6;--muted:#9caabd;
  --amber:#ffb24c;--amber2:#ff8b4b;--violet:#8a67f8;--violet2:#b263ff;--cyan:#46d4d0;--green:#3ed187;
  --danger:#ff6f77;--shadow:0 18px 50px rgba(0,0,0,.28);--radius:18px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 55% -10%,rgba(116,71,210,.19),transparent 33%),linear-gradient(180deg,#081321,#06101c 58%,#07111f);overflow-x:hidden}button,input,textarea{font:inherit}button{cursor:pointer}code,pre,textarea{font-family:"JetBrains Mono",Consolas,monospace}a{color:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:224px minmax(0,1fr)}
.sidebar{position:sticky;top:0;height:100vh;padding:22px 15px 18px;background:linear-gradient(180deg,#071421,#081625 68%,#0a1728);border-right:1px solid var(--line-soft);display:flex;flex-direction:column;gap:18px;z-index:40}.brand{height:52px;display:flex;align-items:center;gap:9px;padding:0 5px;text-decoration:none;font-size:23px;font-weight:850;letter-spacing:-.9px}.brand img{width:43px;height:43px;filter:drop-shadow(0 8px 18px rgba(38,201,193,.18))}.brand>span>span{color:var(--amber)}.nav-list{display:flex;flex-direction:column;gap:6px}.nav-item{height:45px;border-radius:12px;display:flex;align-items:center;gap:12px;padding:0 13px;text-decoration:none;color:#d7dfeb;font-size:13px;font-weight:650;transition:.18s ease}.nav-item span{width:22px;text-align:center;color:#f2c98d;font-size:16px}.nav-item:hover{background:rgba(255,255,255,.045);transform:translateX(2px)}.nav-item.active{color:#fff;background:linear-gradient(90deg,rgba(255,136,76,.18),rgba(126,88,224,.16));border:1px solid rgba(250,175,105,.18);box-shadow:inset 3px 0 0 var(--amber),0 10px 25px rgba(0,0,0,.12)}.sidebar-spacer{flex:1}.module-stack{display:flex;flex-direction:column;gap:10px}.side-card{border:1px solid var(--line-soft);background:linear-gradient(145deg,rgba(24,32,49,.98),rgba(17,24,39,.98));border-radius:14px;box-shadow:0 12px 28px rgba(0,0,0,.18)}.mission-card{padding:12px;display:grid;grid-template-columns:42px 1fr;gap:10px}.mini-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:19px;background:linear-gradient(145deg,#52301f,#2b2231);border:1px solid rgba(255,172,79,.16)}.mini-icon.warm{box-shadow:inset 0 0 24px rgba(255,165,77,.08)}.mission-card strong,.focus-card strong,.support-card strong{font-size:12px}.mission-card p{font-size:10px;color:var(--muted);line-height:1.4;margin:4px 0 8px}.mini-progress{height:5px;border-radius:99px;background:#243147;overflow:hidden}.mini-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--amber),var(--violet))}.side-row{display:flex;align-items:center;justify-content:space-between;margin-top:8px}.side-row small{color:#d9e0e8;font-size:9px}.tiny-btn{border:0;border-radius:8px;padding:7px 9px;background:linear-gradient(135deg,var(--amber),#e97e46);color:#22130b;font-size:9px;font-weight:800}.focus-card{padding:11px 12px;display:flex;align-items:center;justify-content:space-between}.focus-card small,.support-card small{display:block;color:var(--muted);font-size:9px;margin-top:3px}.toggle{width:41px;height:23px;border:0;border-radius:99px;background:#364257;padding:3px}.toggle span{display:block;width:17px;height:17px;border-radius:50%;background:#f5ead9;transition:.2s}.toggle.active{background:linear-gradient(90deg,#2d9368,#e8a750)}.toggle.active span{transform:translateX(18px)}.support-card{padding:11px 12px;display:grid;grid-template-columns:25px 1fr auto;gap:8px;align-items:center}.support-card>span{color:#ff6688;font-size:19px}.tiny-btn.rose{background:linear-gradient(135deg,#ff4c88,#e84d6e);color:white}.logout-link{text-decoration:none;color:#7f8da2;font-size:10px;padding:0 7px}.logout-link:hover{color:#fff}
.main{min-width:0}.topbar{height:74px;padding:0 22px;display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:30;background:rgba(7,17,31,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--line-soft)}.search{width:min(520px,44vw);height:42px;border:1px solid var(--line);background:#101a2a;border-radius:12px;display:flex;align-items:center;gap:9px;padding:0 12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}.search>span{color:#f3b96b;font-size:18px}.search input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#fff;font-size:12px}.search input::placeholder{color:#78879c}.search kbd{color:#718096;background:#192438;border:1px solid #2b3950;border-radius:6px;padding:3px 6px;font-size:9px}.top-stats{margin-left:auto;display:flex;align-items:center}.top-stats>div{min-width:83px;display:grid;grid-template-columns:auto auto;column-gap:7px;align-items:center;padding:0 14px;border-left:1px solid var(--line-soft)}.top-stats>div>span{grid-row:1/3;font-size:22px}.top-stats small{font-size:8px;color:#7f8da3}.top-stats strong{font-size:12px}.level-gem{width:31px!important;height:31px!important;display:grid;place-items:center;background:linear-gradient(145deg,#6846ff,#b463ff);clip-path:polygon(50% 0,94% 24%,83% 80%,50% 100%,17% 80%,6% 24%);font-size:9px!important}.profile-chip{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#101b2d;border-radius:13px;padding:5px 9px 5px 5px}.profile-chip .avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#e99d54,#6f57c9);font-weight:900;border:2px solid rgba(255,184,101,.6)}.profile-chip small,.profile-chip strong{display:block}.profile-chip small{font-size:8px;color:#8d9aab}.profile-chip strong{font-size:10px}
.dashboard-grid{padding:14px 22px 18px;display:grid;grid-template-columns:minmax(275px,.84fr) minmax(500px,1.55fr) minmax(300px,.92fr);grid-template-areas:"hero hero next" "lesson editor map" "lesson editor guide" "challenge project progress";gap:12px;align-items:start}.hero-slot{grid-area:hero}.map-slot{grid-area:map}.lesson-slot{grid-area:lesson}.editor-slot{grid-area:editor}.guide-slot{grid-area:guide}.progress-slot{grid-area:progress}#slot-next{grid-area:next}#slot-challenge{grid-area:challenge}#slot-project{grid-area:project}.module-host{width:100%}.card{min-width:0;border:1px solid var(--line);background:linear-gradient(145deg,rgba(18,30,49,.98),rgba(12,22,38,.98));border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.card-title{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;color:#f5e7d5;letter-spacing:-.1px}.card-title .xp-pill,.card-title .status-pill{margin-left:auto}.btn{border:1px solid #344761;background:#17243a;color:#eff4fa;border-radius:10px;padding:9px 12px;font-size:10px;font-weight:750;transition:.16s ease}.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}.btn:disabled{opacity:.42;cursor:not-allowed;transform:none}.btn.primary{background:linear-gradient(135deg,#ffb23d,#ff7448);border-color:#ffc15b;color:#26140b;box-shadow:0 7px 20px rgba(255,126,66,.22)}.btn.warm{background:linear-gradient(135deg,#f2ad4f,#d8735d);border-color:#f0a45b;color:#25150e}.btn.purple{background:linear-gradient(135deg,#7a52e5,#b252bb);border-color:#976ae9;color:#fff}.btn.run{background:linear-gradient(135deg,#22c579,#3dac69);border-color:#55d494;color:#fff}.btn.ghost{background:#152035}.btn.text{background:transparent;border-color:transparent;color:#a98cff}.btn.wide{width:100%}
.hero-card{height:262px;padding:18px 22px;position:relative;display:grid;grid-template-columns:190px minmax(280px,1fr) 38%;align-items:center;background:radial-gradient(circle at 67% 33%,rgba(255,125,76,.26),transparent 21%),radial-gradient(circle at 44% 0,rgba(150,71,213,.23),transparent 31%),linear-gradient(118deg,#101f36 0%,#30233b 50%,#723c38 72%,#18243c 100%)}.hero-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(5,10,22,.35));pointer-events:none}.hero-mascot{z-index:2;display:flex;align-items:center;justify-content:center}.hero-mascot img{width:185px;max-height:225px;filter:drop-shadow(0 20px 24px rgba(0,0,0,.35))}.hero-copy{z-index:3;padding-left:4px}.eyebrow{display:inline-flex;color:#ffc15d;font-size:9px;letter-spacing:1.8px;font-weight:850}.hero-copy h1{font-size:34px;line-height:1.03;letter-spacing:-1.2px;margin:9px 0 9px}.hero-copy h1 span{color:#ffe5bd}.hero-copy>p{font-size:12px;color:#ded2d3;margin:0 0 18px}.route-progress>div:first-child{display:flex;justify-content:space-between;gap:12px;font-size:9px;margin-bottom:6px}.route-progress b{color:#ffc464}.progress-track{height:7px;border-radius:99px;background:#26354b;overflow:hidden}.progress-track span{height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,var(--amber),var(--cyan),var(--violet))}.route-progress small{display:block;color:#ac9ea6;font-size:9px;margin-top:6px}.hero-scenery{position:absolute;right:0;top:0;bottom:0;width:39%;z-index:1;overflow:hidden}.hero-scenery:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(42,33,56,.15),transparent)}.moon{position:absolute;right:74px;top:30px;width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffd474,#ef8745);box-shadow:0 0 55px rgba(246,126,74,.55)}.mountain{position:absolute;bottom:0;background:linear-gradient(145deg,#30375e,#151b3c);clip-path:polygon(50% 0,100% 100%,0 100%);opacity:.93}.m1{right:-18px;width:188px;height:154px}.m2{right:126px;width:142px;height:111px}.castle{position:absolute;right:112px;bottom:72px;font-size:58px;color:#271b39;text-shadow:0 0 18px rgba(255,152,84,.55)}.path-dots{position:absolute;right:20px;bottom:44px;display:flex;gap:18px;transform:rotate(-13deg)}.path-dots i{width:11px;height:11px;border-radius:50%;background:#7150ca;border:2px solid #ceb6ff;box-shadow:0 0 12px rgba(160,125,255,.4)}.hero-btn{position:absolute;right:28px;bottom:22px;z-index:4}
.next-card{height:262px;padding:18px;display:grid;grid-template-columns:52px 1fr;gap:10px 12px;align-content:start}.next-card .card-title{grid-column:1/3}.lesson-badge{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#653fe0,#8f60e4);font-size:16px;font-weight:850;box-shadow:0 10px 25px rgba(111,77,226,.25)}.next-copy h3{font-size:15px;margin:3px 0 6px}.next-copy p{font-size:10px;color:#9eacbd;line-height:1.55;margin:0 0 11px}.meta{display:flex;gap:5px;flex-wrap:wrap}.meta span{background:#1b2940;border:1px solid #273852;color:#d8b67a;padding:4px 6px;border-radius:99px;font-size:7px}.next-card>.btn{grid-column:1/3;margin-top:auto;height:42px}
.lesson-card{min-height:456px;padding:18px}.lesson-card .lesson-number{width:45px;height:45px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#7048eb,#9b60e7);margin:16px 0 12px;font-size:15px;font-weight:850}.lesson-card h2{font-size:23px;margin:0 0 9px;letter-spacing:-.5px}.lesson-card>p{font-size:11px;color:#c3cfdd;line-height:1.63;margin:0}.lesson-card h4{color:#ffc164;font-size:11px;margin:17px 0 8px}.lesson-points{padding:0;margin:0 0 14px;list-style:none}.lesson-points li{position:relative;padding:4px 0 4px 17px;color:#ced8e4;font-size:10px}.lesson-points li:before{content:"◆";position:absolute;left:0;color:#9a75fa;font-size:7px;top:7px}.tip-box{display:grid;grid-template-columns:27px 1fr;gap:8px;align-items:start;border:1px solid rgba(255,177,79,.22);background:linear-gradient(135deg,rgba(255,148,66,.08),rgba(118,82,211,.09));border-radius:11px;padding:10px;margin:12px 0}.tip-box p{font-size:9px;color:#cdd5e0;line-height:1.45;margin:0}.tip-box code{color:#ffc669}.lesson-card>.btn{margin-top:4px}
.editor-card{min-height:456px}.editor-head{height:45px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.runtime{font-size:8px;color:#9eadc0;border:1px solid #293a53;border-radius:99px;padding:5px 8px;background:#121f32}.runtime i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);margin-right:5px}.tabs{height:36px;padding:5px 9px;border-bottom:1px solid var(--line);background:#0e192a}.tab{border:0;border-radius:7px;background:#1c2c46;color:#fff;padding:5px 9px;font-size:8px}.tab.plus{background:transparent;color:#9cacbf}.code-wrap{height:223px;display:grid;grid-template-columns:44px 1fr;background:#081524}.line-nos{padding:13px 8px;text-align:right;border-right:1px solid #172b45;color:#5d718c;font-size:10px;line-height:28px;font-family:"JetBrains Mono",monospace;user-select:none}.code-wrap textarea{width:100%;height:100%;resize:none;border:0;outline:0;background:transparent;color:#f0f5fb;padding:13px 15px;font-size:11px;line-height:28px;caret-color:#fff}.editor-actions{padding:9px;display:flex;gap:7px;border-top:1px solid #1c2c43;border-bottom:1px solid #273950;background:#0f1b2d}.console{background:#081422}.console-head{height:37px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #1d3048}.console-head strong{font-size:11px}.console-head .clear{border:0;background:transparent;color:#8495aa}.console pre{height:118px;overflow:auto;margin:0;padding:10px 13px;color:#d8e3ef;font-size:9px;line-height:1.55;white-space:pre-wrap}
.map-card{height:287px;padding:14px}.fantasy-map{height:218px;margin-top:10px;position:relative;overflow:hidden;border-radius:13px;background:radial-gradient(circle at 76% 27%,rgba(243,158,78,.16),transparent 19%),linear-gradient(160deg,#173352,#16314a 45%,#0e2741);box-shadow:inset 0 0 55px rgba(0,0,0,.22)}.fantasy-map:before{content:"";position:absolute;left:-11%;bottom:18px;width:76%;height:71%;border-radius:48% 53% 43% 58%;background:linear-gradient(145deg,#52714f,#334b38);transform:rotate(7deg);box-shadow:inset 0 0 35px rgba(225,180,93,.12)}.fantasy-map:after{content:"";position:absolute;right:-6%;top:16px;width:59%;height:59%;border-radius:58% 43% 55% 44%;background:linear-gradient(145deg,#4b6a47,#2e4433);transform:rotate(-8deg)}.river{position:absolute;z-index:2;left:52%;top:-12px;width:28px;height:255px;background:linear-gradient(90deg,#245e83,#287eb0,#1a5579);border-radius:50%;transform:rotate(21deg)}.castle-map{position:absolute;z-index:4;right:25px;top:25px;font-size:38px;color:#e19a50;text-shadow:0 8px 15px rgba(0,0,0,.35)}.route-line{position:absolute;z-index:3;left:43px;top:118px;width:220px;border-top:4px dashed #e5c185;transform:rotate(-2deg)}.node{position:absolute;z-index:6;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#6b6662;border:3px solid #b7a791;color:#fff;font-size:10px;font-weight:850;box-shadow:0 8px 15px rgba(0,0,0,.28)}.node.done{background:#18895c;border-color:#75d7a5}.node.active{background:#6646c6;border-color:#c3a4ff;box-shadow:0 0 0 7px rgba(143,99,231,.18),0 8px 15px rgba(0,0,0,.28)}.n1{left:43px;top:101px}.n2{left:91px;top:93px}.n3{left:140px;top:86px}.n4{left:193px;top:72px}.n5{left:239px;top:105px}.n6{left:270px;top:150px}.legend{display:flex;justify-content:space-between;gap:8px;margin-top:8px;color:#8f9daf;font-size:7px}.legend span{display:flex;align-items:center;gap:4px}.dot{width:7px;height:7px;border-radius:50%;background:#857e77}.dot.done{background:#3cc98a}.dot.current{background:#8d6bf6}
.guide-card{height:287px;padding:14px;background:radial-gradient(circle at 12% 42%,rgba(22,134,196,.20),transparent 33%),linear-gradient(145deg,#101d32,#231931)}.guide-head{display:flex;align-items:center;justify-content:space-between}.online{font-size:7px;color:#9dafc1;border:1px solid #29405a;border-radius:99px;padding:4px 7px}.online i{display:inline-block;width:6px;height:6px;background:var(--green);border-radius:50%;margin-right:4px}.guide-visual{display:flex;align-items:center;gap:11px;padding:14px 0 10px}.guide-compass{width:56px;height:56px;flex:0 0 56px;border-radius:50%;display:grid;place-items:center;font-size:27px;background:radial-gradient(circle,#ffc05b 0 16%,#8758ef 38%,#1d2f4b 66%);box-shadow:0 0 28px rgba(123,83,255,.3)}.guide-visual strong{font-size:10px}.guide-visual small{display:block;color:#8092aa;font-size:7px;margin-top:4px}.checks{display:grid;grid-template-columns:1fr 1fr;gap:5px}.checks span{border:1px solid #314b67;background:#11243b;border-radius:8px;padding:6px 7px;color:#d5e0ec;font-size:7px}.guide-message{margin-top:8px;border:1px solid #594d83;background:linear-gradient(135deg,#172d4f,#31213f);border-radius:10px;padding:9px 10px}.guide-message strong{font-size:8px}.guide-message p{font-size:8px;color:#c9d7e8;line-height:1.45;margin:4px 0 0}.guide-actions{display:flex;gap:7px;margin-top:8px}.guide-actions .btn{flex:1}
.compact-card{min-height:146px;padding:13px;display:grid;grid-template-columns:44px 1fr;gap:9px 11px}.compact-icon{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#6f4127,#292331);font-size:18px}.compact-icon.green{background:linear-gradient(145deg,#41653d,#20352b)}.compact-copy h3{font-size:13px;margin:7px 0 4px}.compact-copy p{font-size:8px;line-height:1.48;color:#aab8c9;margin:0}.compact-copy small{font-size:7px;color:#aebac9}.compact-actions{grid-column:2;display:flex;gap:7px;align-items:center}.xp-pill,.status-pill{font-size:7px;border-radius:99px;padding:4px 7px}.xp-pill{background:#4b351a;color:#ffc45b}.status-pill{background:#163c2c;color:#57db94}.challenge-status{font-size:7px;color:#91a2b7;margin-top:8px;line-height:1.35}.progress-track.small{height:5px;margin:8px 0 5px}.stats-card{min-height:146px;padding:13px}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:10px}.stat-grid>div{min-width:0;border:1px solid #293b55;background:#142138;border-radius:10px;padding:8px;display:grid;grid-template-columns:auto 1fr;column-gap:6px}.stat-grid span{grid-row:1/3;font-size:17px}.stat-grid strong{font-size:12px}.stat-grid small{font-size:6px;color:#8292a7}.stats-card>.btn{margin-top:8px}.footer{padding:7px 23px 17px;display:flex;justify-content:space-between;color:#6f8097;font-size:8px}.toast{position:fixed;right:20px;bottom:20px;z-index:99;background:#14253c;border:1px solid #3a5473;color:#fff;padding:11px 13px;border-radius:10px;box-shadow:0 18px 35px rgba(0,0,0,.28);font-size:10px}.module-error{padding:14px;border-color:#814951}.module-error p,.module-error small{font-size:9px;color:#d3a8ae}
.auth-shell{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr}.auth-art{position:relative;padding:32px;background:radial-gradient(circle at 32% 58%,rgba(255,141,65,.28),transparent 28%),radial-gradient(circle at 68% 19%,rgba(111,76,231,.34),transparent 26%),linear-gradient(145deg,#0a1727,#16132d);overflow:hidden}.brand-large{font-size:38px;justify-content:center;width:100%;height:64px;padding:0;text-align:center}.auth-copy{position:absolute;left:11%;top:38%;max-width:520px}.auth-copy h1{font-size:50px;line-height:.98;letter-spacing:-2px;margin:12px 0}.auth-copy p{font-size:14px;color:#c5d0dd;line-height:1.6}.auth-panel{display:grid;place-items:center;padding:30px;background:#081321}.auth-card{width:min(430px,92%);padding:29px;border:1px solid #293d58;background:#0f1b2d;border-radius:19px;box-shadow:0 25px 60px rgba(0,0,0,.28)}.auth-card h2{font-size:27px;margin:0 0 5px}.auth-card>p{font-size:11px;color:#8e9daf}.auth-card label{display:block;font-size:10px;color:#c7d3e1;margin-top:15px}.auth-card input{width:100%;margin-top:7px;padding:11px 12px;border:1px solid #2d405b;border-radius:10px;background:#091523;color:#fff;outline:0}.auth-card .btn{margin-top:18px}.auth-switch{text-align:center;margin-top:15px!important}.auth-switch a{color:#ffb34d}.form-error{background:#3c1f2b;border:1px solid #7f3a51;color:#ffb3c6;border-radius:9px;padding:9px;font-size:9px}
.focus-mode .map-slot,.focus-mode #slot-next,.focus-mode #slot-challenge,.focus-mode #slot-project,.focus-mode .progress-slot,.focus-mode .hero-slot{opacity:.16;filter:grayscale(.85);pointer-events:none}.focus-mode .lesson-slot,.focus-mode .editor-slot,.focus-mode .guide-slot{filter:drop-shadow(0 0 18px rgba(101,81,216,.14))}
@media (min-width:1800px){.app-shell{grid-template-columns:244px minmax(0,1fr)}.dashboard-grid{grid-template-columns:minmax(295px,.82fr) minmax(570px,1.58fr) minmax(330px,.94fr);gap:14px}.hero-card,.next-card{height:280px}.lesson-card,.editor-card{min-height:478px}.hero-copy h1{font-size:38px}.hero-mascot img{width:200px}.map-card,.guide-card{height:300px}}
@media(max-width:1280px){.app-shell{grid-template-columns:190px 1fr}.dashboard-grid{grid-template-columns:minmax(240px,.82fr) minmax(430px,1.45fr);grid-template-areas:"hero hero" "next next" "lesson editor" "map guide" "challenge project" "progress progress"}.hero-card{grid-template-columns:170px 1fr 36%}.profile-chip span:last-child{display:none}}
@media(max-width:900px){.app-shell{display:block}.sidebar{position:relative;height:auto;display:block;padding:12px}.brand{margin-bottom:10px}.nav-list{display:grid;grid-template-columns:repeat(4,1fr)}.nav-item{justify-content:center;padding:0;font-size:0}.nav-item span{font-size:17px}.sidebar-spacer,.module-stack,.logout-link{display:none}.topbar{position:relative;height:auto;min-height:68px;flex-wrap:wrap;padding:10px 12px}.search{width:100%;order:2}.top-stats{display:none}.dashboard-grid{padding:10px 12px;grid-template-columns:1fr;grid-template-areas:"hero" "next" "lesson" "editor" "guide" "map" "challenge" "project" "progress"}.hero-card{height:auto;min-height:290px;grid-template-columns:115px 1fr;padding:16px}.hero-mascot img{width:125px}.hero-scenery{display:none}.hero-copy h1{font-size:28px}.editor-actions{flex-wrap:wrap}.auth-shell{grid-template-columns:1fr}.auth-art{min-height:260px}.auth-copy{position:relative;left:auto;top:auto;margin-top:65px}.auth-copy h1{font-size:36px}.footer{flex-direction:column;gap:5px}}


/* --- v3 real route polish --- */
.top-stats>div{min-width:115px}
.top-stats strong{font-size:11px;line-height:1.25}
.real-hero{height:262px;padding:22px 24px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:stretch;background:radial-gradient(circle at 70% 18%,rgba(255,137,70,.25),transparent 22%),radial-gradient(circle at 42% -15%,rgba(116,87,246,.25),transparent 28%),linear-gradient(120deg,#111d34 0%,#271f3e 58%,#5a3242 100%)}
.real-hero .hero-copy.solo{padding:0;display:flex;flex-direction:column;justify-content:center}
.real-hero .hero-copy h1{font-size:40px;margin:10px 0 10px}
.real-hero .hero-copy p{max-width:680px;font-size:13px;color:#ddd6df}
.hero-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.hero-tags .tag{font-size:10px;padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(8,15,30,.22)}.hero-tags .current{color:#ffd38d}.hero-tags .next{color:#c7bbff}.hero-plan{display:flex;align-items:center}.plan-card{height:100%;width:100%;border-radius:16px;padding:16px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(10,18,34,.48),rgba(10,18,34,.72));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}.plan-card strong{display:block;font-size:14px;margin-bottom:10px}.plan-card ul{margin:0 0 16px;padding-left:17px;color:#dce3eb;font-size:11px;line-height:1.8}.plan-card code{color:#ffcb79}
.lesson-card h2{font-size:28px}.lesson-card .lesson-number{width:52px;height:52px;font-size:18px}.lesson-card>p{font-size:12px}.lesson-card h4{font-size:12px}.lesson-points li{font-size:11px}.tip-box p{font-size:10px}
.next-card{padding:18px 18px 16px}.next-copy h3{font-size:22px}.next-copy p{font-size:12px}.next-card>.btn{height:44px}
.editor-head .card-title,.console-head strong{font-size:14px}.runtime{font-size:10px}.tab{font-size:10px}.code-wrap{height:254px}.code-wrap textarea{font-size:14px;line-height:31px}.line-nos{font-size:11px;line-height:31px}.console pre{height:112px;font-size:11px}
.real-map-card{padding:16px;min-height:420px;height:auto}.road-summary{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-top:12px;padding:12px;border-radius:12px;background:#101c31;border:1px solid #223652}.road-summary strong{display:block;font-size:14px}.road-summary small{display:block;margin-top:4px;color:#92a3b8;font-size:10px}.road-percent{font-size:20px;font-weight:800;color:#ffc978}.road-list{list-style:none;margin:12px 0 0;padding:0;position:relative}.road-list:before{content:'';position:absolute;left:19px;top:8px;bottom:12px;width:2px;background:linear-gradient(180deg,#3c5778,#223149)}.road-item{position:relative;display:grid;grid-template-columns:28px 1fr auto;gap:12px;align-items:center;padding:10px 0 10px 0}.road-index{position:relative;z-index:1;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;background:#364458;color:#d9e0e8;border:2px solid #526172}.road-copy strong{display:block;font-size:12px}.road-copy small{display:block;margin-top:3px;color:#90a3b8;font-size:10px}.road-state{font-size:9px;font-weight:800;border-radius:999px;padding:6px 8px;border:1px solid #2d405d;background:#132039;color:#c8d4e3}.road-item.current .road-index{background:linear-gradient(135deg,#7d5bff,#af6aff);border-color:#ccb3ff;box-shadow:0 0 0 6px rgba(138,103,248,.16)}.road-item.current .road-state{background:#2d2350;color:#f3ddff;border-color:#7051df}.road-item.next .road-index{background:linear-gradient(135deg,#ffb24c,#ff8453);border-color:#ffd99a;color:#2d1b09}.road-item.next .road-state{background:#4b341d;color:#ffd08f;border-color:#6a4925}.road-item.locked .road-index{background:#394658;border-color:#5c6877;color:#9ca9b7}.road-where{margin-top:14px;padding:12px;border-radius:12px;background:linear-gradient(180deg,#10192b,#0c1727);border:1px solid #223652}.road-where strong{display:block;font-size:12px;margin-bottom:5px}.road-where p{margin:0;font-size:10px;color:#b1bfd0;line-height:1.55}
.compact-copy h3{font-size:18px}.compact-copy p{font-size:10px}.challenge-status{font-size:10px}.compact-actions .btn{font-size:10px}.stats-card{min-height:170px}.stat-grid strong{font-size:14px}.stat-grid small{font-size:8px}.footer{font-size:9px}
.guide-card .guide-message p{font-size:10px}.guide-card .checks span{font-size:10px}
@media(max-width:1280px){.real-hero{grid-template-columns:1fr}.hero-plan{display:none}}


/* --- v4 clean dashboard --- */
.clean-dashboard{
  grid-template-columns:minmax(285px,.82fr) minmax(560px,1.58fr) minmax(330px,.96fr);
  grid-template-areas:
    "hero hero next"
    "lesson editor map"
    "lesson editor guide";
  padding-bottom:12px;
}
.clean-dashboard .hero-slot{grid-area:hero}
.clean-dashboard #slot-next{grid-area:next}
.clean-dashboard .lesson-slot{grid-area:lesson}
.clean-dashboard .editor-slot{grid-area:editor}
.clean-dashboard .map-slot{grid-area:map}
.clean-dashboard .guide-slot{grid-area:guide}
.clean-dashboard .editor-card{min-height:520px}
.clean-dashboard .lesson-card{min-height:520px}
.clean-dashboard .real-map-card{min-height:420px}
.clean-dashboard .guide-card{min-height:220px;height:auto}
.footer{padding-top:4px}
.logout-form{margin:0}.logout-form .logout-link{width:100%;border:0;cursor:pointer;font:inherit;text-align:left}

.daily-challenge-slot{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:80;
  width:min(390px,calc(100vw - 36px));
  pointer-events:none;
  opacity:0;
  transform:translateY(14px) scale(.98);
  transition:.22s ease;
}
.daily-challenge-slot.visible{pointer-events:auto;opacity:1;transform:none}
.daily-challenge-card{
  position:relative;
  display:grid;
  grid-template-columns:46px 1fr;
  gap:11px;
  padding:15px;
  border-radius:16px;
  border:1px solid rgba(255,173,86,.33);
  background:linear-gradient(145deg,rgba(20,30,49,.98),rgba(33,24,45,.98));
  box-shadow:0 24px 70px rgba(0,0,0,.45),0 0 0 1px rgba(132,95,238,.08) inset;
  backdrop-filter:blur(16px);
}
.daily-close{
  position:absolute;right:10px;top:8px;width:28px;height:28px;border:0;border-radius:8px;
  color:#98a7ba;background:transparent;font-size:20px;line-height:1;
}
.daily-close:hover{background:rgba(255,255,255,.06);color:#fff}
.daily-icon{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:20px;background:linear-gradient(145deg,#634125,#2d253b);border:1px solid rgba(255,173,86,.2)}
.daily-copy{padding-right:26px}.daily-kicker{display:block;color:#ffbd64;font-size:9px;font-weight:850;letter-spacing:.8px;margin-bottom:4px}.daily-copy strong{font-size:16px}.daily-copy p{margin:5px 0 8px;color:#afbdcf;font-size:10px;line-height:1.48}.daily-status{min-height:14px;color:#8fa1b8;font-size:9px}.daily-actions{grid-column:2;display:flex;gap:7px}.daily-actions .btn{flex:1}
.daily-code,.daily-output{display:block;width:100%;margin:7px 0;border:1px solid #334963;border-radius:9px;background:#091523;color:#dce8f5;font:10px/1.5 "JetBrains Mono",monospace}
.daily-code{min-height:70px;padding:8px;resize:vertical;outline:0}.daily-code:focus{border-color:#8c6af1;box-shadow:0 0 0 2px rgba(140,106,241,.12)}.daily-code[readonly]{opacity:.72}
.daily-output{min-height:31px;max-height:72px;overflow:auto;padding:7px;white-space:pre-wrap;color:#9fdcb9}

@media(max-width:1280px){
  .clean-dashboard{grid-template-columns:minmax(250px,.85fr) minmax(450px,1.45fr);grid-template-areas:"hero hero" "next next" "lesson editor" "map guide"}
}
@media(max-width:900px){
  .clean-dashboard{grid-template-columns:1fr;grid-template-areas:"hero" "next" "lesson" "editor" "map" "guide"}
  .daily-challenge-slot{right:12px;bottom:12px}
}


/* v5 · Mastery tokens + clean lesson helper */
.lesson-helper{display:grid;grid-template-columns:56px 1fr;gap:10px;align-items:center;margin:14px 0;padding:10px 12px;border:1px solid rgba(255,177,79,.22);background:linear-gradient(135deg,rgba(255,148,66,.08),rgba(118,82,211,.10));border-radius:13px}.lesson-helper img{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 7px 12px rgba(0,0,0,.25))}.lesson-helper strong{font-size:10px;color:#ffd08c}.lesson-helper p{margin:4px 0 0;font-size:9px;line-height:1.45;color:#cbd7e5}.lesson-helper b,.lesson-helper code{color:#ffc669}.mastery-box{margin-top:12px;border:1px solid #314864;background:linear-gradient(145deg,#0c1a2c,#121c31);border-radius:13px;padding:12px}.mastery-kicker{display:block;color:#a890ff;font-size:8px;font-weight:900;letter-spacing:1.25px;margin-bottom:5px}.mastery-box>strong{display:block;font-size:10px;line-height:1.45}.mastery-status{margin:7px 0;color:#91a4ba;font-size:9px;line-height:1.4}.mastery-actions{display:flex;gap:7px}.mastery-actions .btn{flex:1}.mastery-token{margin-top:10px;padding:11px;border-radius:11px;border:1px solid rgba(74,211,144,.32);background:linear-gradient(135deg,rgba(36,139,91,.18),rgba(25,43,74,.72))}.mastery-token small{display:block;color:#84dab0;font-size:8px}.mastery-token strong{display:block;margin:5px 0;font-family:"JetBrains Mono",monospace;font-size:18px;letter-spacing:1px;color:#eefff5;user-select:all}.mastery-token p{font-size:8px;color:#a8bdaf;margin:0;line-height:1.4}

#slot-overlay{position:relative;z-index:100}.cq-modal-backdrop{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:18px;background:rgba(1,8,18,.72);backdrop-filter:blur(8px)}.cq-modal-backdrop[hidden]{display:none}.cq-modal{position:relative;width:min(460px,92vw);padding:24px;border-radius:18px;border:1px solid #405779;background:radial-gradient(circle at 50% 0,rgba(132,89,255,.16),transparent 38%),linear-gradient(145deg,#101e32,#0b1728);box-shadow:0 28px 90px rgba(0,0,0,.55)}.modal-close{position:absolute;right:12px;top:10px;width:34px;height:34px;border:0;border-radius:10px;background:#17253a;color:#b8c5d6;font-size:22px}.token-shield{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;font-size:27px;background:linear-gradient(145deg,#583dde,#9d60f7);box-shadow:0 12px 28px rgba(117,72,224,.3);margin-bottom:14px}.modal-kicker{color:#ffbd62;font-size:9px;font-weight:900;letter-spacing:1.5px}.cq-modal h2{font-size:24px;line-height:1.08;margin:8px 0}.cq-modal>p{font-size:11px;line-height:1.6;color:#acbbce;margin:0 0 15px}.cq-modal label{display:block;font-size:10px;color:#dce4ee;margin-bottom:6px}.token-input{width:100%;height:47px;border:1px solid #344c6c;border-radius:11px;background:#081524;color:#fff;padding:0 13px;font-family:"JetBrains Mono",monospace;font-weight:700;text-transform:uppercase;outline:0}.token-input:focus{border-color:#9b72ff;box-shadow:0 0 0 3px rgba(139,103,248,.13)}.token-feedback{min-height:28px;padding:7px 0;font-size:10px;color:#9eacbd}.token-feedback.error{color:#ff9aa3}.token-feedback.success{color:#75dca7}.token-note{display:block;text-align:center;margin-top:9px;color:#72869f;font-size:8px;line-height:1.4}.lesson-badge.muted{background:#344158;color:#98a8bb;box-shadow:none}

@media(min-width:1500px){.lesson-card{padding:20px}.lesson-helper p,.mastery-status{font-size:10px}.mastery-box>strong{font-size:11px}}


/* --- v6 lesson-first mastery flow --- */
body.modal-open{overflow:hidden}.lesson-class-backdrop{z-index:1300}.lesson-class-modal{width:min(720px,94vw);max-height:88vh;overflow:auto;padding:26px}.lesson-class-modal .class-intro{margin-bottom:18px}.lesson-class-content{display:grid;gap:10px}.lesson-class-section{display:grid;grid-template-columns:38px 1fr;gap:12px;padding:13px;border:1px solid #293f5c;background:linear-gradient(145deg,#0b182a,#101d31);border-radius:13px}.class-step{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(145deg,#6545dc,#9963f0);font-size:9px;font-weight:900;color:#fff}.lesson-class-section h3{font-size:14px;margin:1px 0 6px}.lesson-class-section p,.lesson-class-section li{font-size:11px;line-height:1.6;color:#b8c7d8}.lesson-class-section ul{margin:5px 0 0;padding-left:17px}.syntax-parts{display:flex;flex-wrap:wrap;gap:8px}.syntax-parts span{min-width:120px;padding:10px;border:1px solid #314864;border-radius:10px;background:#081524}.syntax-parts b{display:block;font-family:"JetBrains Mono",monospace;font-size:15px;color:#ffd07e}.syntax-parts small{display:block;margin-top:4px;color:#8194ad;font-size:9px}.class-code{margin:7px 0 6px;padding:12px;border-radius:10px;background:#071321;border:1px solid #253b56;color:#f5f7fb;font-size:12px;white-space:pre-wrap}.class-warning{margin:0!important;padding:8px 10px;border-radius:9px;background:rgba(255,177,79,.08);border:1px solid rgba(255,177,79,.18);color:#e9c58f!important}.lesson-class-check{padding:13px;border-radius:12px;border:1px solid rgba(68,210,151,.2);background:rgba(42,142,102,.08)}.lesson-class-check strong{font-size:12px;color:#83e2b4}.lesson-class-check p{font-size:10px;color:#b8c9d6;margin:5px 0 0;line-height:1.5}.class-footer{position:sticky;bottom:-26px;margin:16px -26px -26px;padding:14px 26px 20px;background:linear-gradient(180deg,rgba(11,23,40,.3),#0b1728 30%);border-top:1px solid #243a55}
.mastery-validate{margin-left:auto!important;border:1px solid #ffcb72!important;background:linear-gradient(135deg,#f5b33f,#df7a2f)!important;color:#271606!important;font-weight:900!important;box-shadow:0 0 0 1px rgba(255,191,85,.1),0 8px 22px rgba(235,139,48,.25)!important}.mastery-validate:hover{filter:brightness(1.06)}.mastery-validate[hidden]{display:none!important}.mastery-validate:disabled{opacity:.65}.lesson-placeholder{margin-top:14px;padding:13px;border:1px dashed #39506e;border-radius:12px;background:#0b1829}.lesson-placeholder strong{font-size:12px}.lesson-placeholder p{font-size:10px;color:#93a4b9;line-height:1.5}
.mastery-result-backdrop{z-index:1400}.mastery-result-modal{width:min(500px,92vw);text-align:left}.result-icon{width:62px;height:62px;border-radius:18px;display:grid;place-items:center;font-size:30px;font-weight:900;margin-bottom:13px}.mastery-result-modal.success{border-color:#396c58}.mastery-result-modal.success .result-icon{background:linear-gradient(145deg,#1e8d5d,#4fd09a);color:#071910;box-shadow:0 15px 35px rgba(55,195,134,.2)}.mastery-result-modal.failure{border-color:#814651}.mastery-result-modal.failure .result-icon{background:linear-gradient(145deg,#7c3547,#d56362);color:white;box-shadow:0 15px 35px rgba(214,88,99,.18)}.issued-token{margin:12px 0;padding:13px;border:1px solid rgba(72,211,145,.28);border-radius:12px;background:rgba(30,111,78,.11)}.issued-token small{display:block;color:#77d9a8;font-size:9px;font-weight:900;letter-spacing:1px}.issued-token strong{display:block;margin:8px 0 10px;font-family:"JetBrains Mono",monospace;font-size:22px;letter-spacing:1px;color:#effff6;user-select:all}.copy-token{padding:7px 10px!important}.result-expiry{margin:10px 0 14px;padding:10px 12px;border-radius:10px;background:rgba(255,177,79,.08);border:1px solid rgba(255,177,79,.18);color:#f0c98d;font-size:10px;line-height:1.45}
@media(max-width:700px){.lesson-class-modal{padding:18px}.lesson-class-section{grid-template-columns:1fr}.class-step{width:31px;height:31px}.class-footer{margin:14px -18px -18px;padding:12px 18px 16px}.syntax-parts span{min-width:100%}.editor-actions{align-items:stretch}.mastery-validate{margin-left:0!important;width:100%}}


/* v7 · pedagogía real + QuestGuide hero */
.hero-guide-card{align-self:stretch;border:1px solid rgba(255,178,77,.18);border-radius:16px;padding:16px;background:linear-gradient(160deg,rgba(24,31,54,.9),rgba(37,24,47,.92));box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 18px 35px rgba(0,0,0,.17);display:flex;flex-direction:column;justify-content:center}.hero-guide-top{display:grid;grid-template-columns:58px 1fr;gap:11px;align-items:center}.hero-guide-top img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(0,0,0,.25))}.hero-guide-top span{display:block;color:#ffbd62;font-size:8px;font-weight:900;letter-spacing:1.1px}.hero-guide-top strong{display:block;margin-top:3px;font-size:13px}.hero-guide-card>p{margin:11px 0 12px;color:#c4d0df;font-size:10px;line-height:1.55}.hero-guide-rule{display:grid;grid-template-columns:20px 1fr;gap:6px;align-items:start;border-top:1px solid rgba(255,255,255,.06);padding-top:10px}.hero-guide-rule span{color:#a98bff}.hero-guide-rule small{color:#8395ad;font-size:8px;line-height:1.45}
.data-type-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0}.data-type-grid>div{padding:10px;border:1px solid #30465f;border-radius:10px;background:#081524}.data-type-grid b{display:block;color:#bba5ff;font-family:"JetBrains Mono",monospace;font-size:11px}.data-type-grid code{display:block;margin:5px 0;color:#ffd07e;font-size:13px}.data-type-grid small{color:#8194ad;font-size:8px}.lesson-class-check b{color:#ffd17c}.guide-avatar{width:48px;height:48px;object-fit:contain;filter:drop-shadow(0 7px 12px rgba(0,0,0,.28))}.editor-actions .tip,.editor-actions .review{white-space:nowrap}.console pre{color:#e2e9f2}.console pre::selection{background:#7253c5}
@media(max-width:700px){.data-type-grid{grid-template-columns:repeat(2,1fr)}.hero-guide-card{display:none}}


/* v8 · QuestGuide embebido + top 50/50 + token recuperable */
.clean-dashboard{
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-areas:
    "hero hero next next"
    "lesson editor editor map";
  align-items:start;
}
.clean-dashboard .hero-slot,.clean-dashboard #slot-next{min-width:0}
.clean-dashboard .hero-card,.clean-dashboard .next-card{height:262px;min-height:262px}
.clean-dashboard .lesson-slot{grid-area:lesson}.clean-dashboard .editor-slot{grid-area:editor}.clean-dashboard .map-slot{grid-area:map}
.next-card{grid-template-rows:auto 1fr auto}.next-actions{grid-column:1/3;display:grid;grid-template-columns:1fr;gap:7px;margin-top:auto}.next-actions .btn{height:40px}.next-card:has(.show-active-token:not([hidden])) .next-actions{grid-template-columns:1fr 1fr}
.lesson-guide-slot{margin:14px 0}.embedded-guide{border:1px solid #304561;background:linear-gradient(155deg,#101d32,#211c38);border-radius:14px;padding:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}.embedded-guide .guide-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.embedded-guide .guide-visual{display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:center}.embedded-guide .guide-message{margin-top:10px}.embedded-guide .guide-actions{display:flex;gap:7px;margin-top:9px}.embedded-guide .guide-actions .btn{flex:1}.embedded-guide.fallback p{font-size:10px;color:#aab9cb}.lesson-helper{display:none!important}
@media(max-width:1280px){.clean-dashboard{grid-template-columns:1fr 1fr;grid-template-areas:"hero next" "lesson editor" "map map"}.clean-dashboard .hero-card,.clean-dashboard .next-card{height:auto;min-height:250px}}
@media(max-width:900px){.clean-dashboard{grid-template-columns:1fr;grid-template-areas:"hero" "next" "lesson" "editor" "map"}.clean-dashboard .hero-card,.clean-dashboard .next-card{min-height:0}}

/* v9 · desktop app viewport: una sola pantalla, scroll solo en móvil */
@media (min-width:901px){
  html,body{height:100%;overflow:hidden}
  body{min-height:0}
  .app-shell{height:100dvh;min-height:0;overflow:hidden;grid-template-columns:232px minmax(0,1fr)}
  .sidebar{position:relative;height:100dvh;min-height:0;overflow:hidden;padding:16px 12px 12px;gap:11px}
  .brand{height:46px;font-size:21px}.brand img{width:38px;height:38px}
  .nav-list{gap:3px}.nav-item{height:38px;font-size:12px}
  .module-stack{gap:7px}.mission-card{padding:9px;grid-template-columns:36px 1fr;gap:8px}.mini-icon{width:36px;height:36px}.mission-card p{font-size:8px;margin:3px 0 5px}.focus-card,.support-card{padding:8px 9px}.logout-link{font-size:8px}
  .main{height:100dvh;min-height:0;display:grid;grid-template-rows:64px minmax(0,1fr);overflow:hidden}
  .topbar{position:relative;top:auto;height:64px;min-height:64px;padding:0 16px;gap:11px}
  .search{height:38px;width:min(520px,40vw)}
  .top-stats>div{min-width:96px;padding:0 10px}.top-stats strong{font-size:10px}.profile-chip{padding:4px 7px 4px 4px}.profile-chip .avatar{width:31px;height:31px}
  .footer{display:none}

  .dashboard-grid.clean-dashboard{
    height:100%;min-height:0;overflow:hidden;
    padding:10px 14px 12px;
    gap:10px;
    grid-template-columns:minmax(245px,.78fr) minmax(500px,1.55fr) minmax(300px,.92fr);
    grid-template-rows:220px minmax(0,1fr);
    grid-template-areas:
      "hero hero next"
      "lesson editor map";
    align-items:stretch;
  }
  .clean-dashboard>.slot,.clean-dashboard>.slot>.module-host{min-height:0;height:100%}
  .clean-dashboard .hero-card,.clean-dashboard .next-card,
  .clean-dashboard .lesson-card,.clean-dashboard .editor-card,
  .clean-dashboard .real-map-card{height:100%!important;min-height:0!important;max-height:none}

  /* fila superior compacta */
  .real-hero{padding:16px 18px;grid-template-columns:minmax(0,1fr) 280px;gap:14px}
  .real-hero .hero-copy h1{font-size:31px;margin:6px 0 7px}.real-hero .hero-copy p{font-size:10px;margin-bottom:10px}
  .eyebrow{font-size:7px}.route-progress small{font-size:7px}.hero-tags{margin-top:8px}.hero-tags .tag{font-size:8px;padding:5px 7px}
  .hero-guide-card{padding:11px}.hero-guide-top{grid-template-columns:44px 1fr;gap:8px}.hero-guide-top img{width:44px;height:44px}.hero-guide-top strong{font-size:11px}.hero-guide-card>p{font-size:8px;margin:7px 0}.hero-guide-rule{padding-top:6px}.hero-guide-rule small{font-size:7px}
  .next-card{padding:14px;grid-template-columns:44px 1fr;gap:8px 10px}.next-card .card-title{font-size:10px}.lesson-badge{width:43px;height:43px}.next-copy h3{font-size:15px;margin:2px 0 4px}.next-copy p{font-size:8px;line-height:1.4;margin-bottom:6px}.meta span{font-size:6px;padding:3px 5px}.next-actions .btn{height:34px;padding:6px 8px;font-size:8px}

  /* segunda fila: nunca empuja el body */
  .lesson-card{padding:13px;overflow:hidden;display:flex;flex-direction:column}
  .lesson-card .card-title{font-size:10px}.lesson-card .lesson-number{width:38px;height:38px;margin:9px 0 7px;font-size:13px}
  .lesson-card h2{font-size:20px;margin-bottom:6px}.lesson-card>p{font-size:9px;line-height:1.48}.lesson-card h4{font-size:9px;margin:10px 0 5px}.lesson-points{margin-bottom:6px}.lesson-points li{font-size:8px;padding:2px 0 2px 14px}.lesson-points li:before{top:4px}
  .lesson-guide-slot{margin:7px 0 0;min-height:0}.embedded-guide{padding:8px}.embedded-guide .guide-head{margin-bottom:5px}.embedded-guide .guide-visual{grid-template-columns:36px 1fr;gap:7px}.embedded-guide .guide-visual img,.embedded-guide .guide-avatar{width:36px;height:36px}.embedded-guide .guide-message{margin-top:6px;padding:7px}.embedded-guide .guide-message p{font-size:7px;line-height:1.35}.embedded-guide .guide-actions{gap:5px;margin-top:5px}.embedded-guide .guide-actions .btn{padding:6px;font-size:7px}
  .lesson-card>.btn{margin-top:auto;height:32px;padding:6px;font-size:8px}

  .editor-card{display:flex;flex-direction:column;overflow:hidden}.editor-head{height:36px;min-height:36px;padding:0 10px}.editor-head .card-title{font-size:10px}.runtime{font-size:7px;padding:4px 6px}.tabs{height:29px;min-height:29px;padding:4px 7px}.tab{font-size:7px;padding:4px 7px}
  .code-wrap{height:auto!important;min-height:0;flex:1;grid-template-columns:38px}.code-wrap textarea{font-size:11px;line-height:24px;padding:9px 11px}.line-nos{font-size:8px;line-height:24px;padding:9px 7px}
  .editor-actions{padding:6px;gap:5px;min-height:42px}.editor-actions .btn{padding:6px 8px;font-size:7px}
  .console{height:150px;min-height:125px;flex:0 0 150px}.console-head{height:30px}.console-head strong{font-size:9px}.console pre{height:120px!important;padding:8px 10px;font-size:8px;line-height:1.45}

  .real-map-card{padding:12px;overflow:hidden;display:flex;flex-direction:column}.real-map-card .card-title{font-size:10px}.road-summary{margin-top:8px;padding:8px}.road-summary strong{font-size:11px}.road-summary small{font-size:7px}.road-percent{font-size:16px}
  .road-list{margin-top:6px;flex:1;min-height:0}.road-list:before{left:15px}.road-item{grid-template-columns:24px 1fr auto;gap:8px;padding:5px 0}.road-index{width:24px;height:24px;font-size:8px}.road-copy strong{font-size:8px}.road-copy small{font-size:6px;margin-top:1px}.road-state{font-size:6px;padding:4px 5px}.road-where{margin-top:6px;padding:7px}.road-where strong{font-size:8px}.road-where p{font-size:6px;line-height:1.35}
}

/* escritorio bajo: compacta todavía más para 768/800/900px de alto */
@media (min-width:901px) and (max-height:850px){
  .main{grid-template-rows:58px minmax(0,1fr)}.topbar{height:58px;min-height:58px}.dashboard-grid.clean-dashboard{grid-template-rows:190px minmax(0,1fr);padding:8px 12px 10px;gap:8px}
  .real-hero .hero-copy h1{font-size:27px}.real-hero .hero-copy p{font-size:9px}.hero-guide-card>p{font-size:7px}.hero-tags{display:none}
  .lesson-card h2{font-size:18px}.lesson-card>p{font-size:8px}.lesson-points li{font-size:7px}.embedded-guide .guide-message p{font-size:6px}
  .console{height:118px;min-height:105px;flex-basis:118px}.console pre{height:88px!important}
  .road-item{padding:3px 0}.road-where{display:none}
}

/* móvil/tablet angosto: vuelve a ser documento normal con scroll */
@media (max-width:900px){
  html,body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
  .app-shell,.main{height:auto;min-height:100vh;overflow:visible}
  .dashboard-grid.clean-dashboard{height:auto;overflow:visible}
  .footer{display:flex}
}


/* v10 · readable desktop + QuestGuide modal + editor grid repair */
.questguide-modal{width:min(560px,92vw);padding:26px}
.questguide-modal-head{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center}
.questguide-modal-head img{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 9px 16px rgba(0,0,0,.3))}
.questguide-modal-head h2{margin:4px 0 0;font-size:26px}
.questguide-subtitle{font-size:13px!important;margin:12px 0 16px!important}
.questguide-modal-message{padding:15px;border-radius:13px;border:1px solid #5d4f88;background:linear-gradient(135deg,#182d4d,#30233d)}
.questguide-modal-message strong{font-size:12px;color:#ffd07b}
.questguide-modal-message p{font-size:14px;line-height:1.55;margin:6px 0 0;color:#e2e8f1}
.questguide-modal-actions{display:flex;gap:9px;margin-top:14px}.questguide-modal-actions .btn{flex:1;font-size:12px;padding:11px}

.hero-readable{grid-template-columns:minmax(0,1fr) 300px!important}
.hero-objective-card{align-self:stretch;border:1px solid rgba(255,178,77,.18);border-radius:16px;padding:15px;background:linear-gradient(160deg,rgba(24,31,54,.9),rgba(37,24,47,.92));display:flex;flex-direction:column;justify-content:center}
.hero-objective-card>span{color:#ffbd62;font-size:10px;font-weight:900;letter-spacing:1.1px}.hero-objective-card>strong{font-size:17px;margin:5px 0}.hero-objective-card>p{font-size:12px;line-height:1.5;color:#c9d4e1;margin:0 0 12px}.hero-objective-card .btn{font-size:11px}

/* Explicit second grid track fixes textarea collapsing/vertical lettering */
.code-wrap{grid-template-columns:48px minmax(0,1fr)!important;overflow:hidden}
.line-nos{width:48px;min-width:48px;overflow:hidden!important;white-space:nowrap}
.code-wrap textarea{min-width:0!important;width:100%!important;display:block;overflow:auto!important;white-space:pre!important;word-break:normal!important;overflow-wrap:normal!important}

@media (min-width:901px){
  /* readable baseline: still one viewport, no body scroll */
  .app-shell{grid-template-columns:232px minmax(0,1fr)}
  .nav-item{font-size:14px;height:40px}.brand{font-size:22px}.mission-card strong,.focus-card strong,.support-card strong{font-size:11px}.mission-card p,.focus-card small,.support-card small{font-size:9px}
  .search input{font-size:13px}.top-stats small{font-size:9px}.top-stats strong{font-size:11px}.profile-chip small{font-size:9px}.profile-chip strong{font-size:11px}
  .dashboard-grid.clean-dashboard{grid-template-columns:minmax(300px,.86fr) minmax(540px,1.55fr) minmax(330px,.94fr);grid-template-rows:220px minmax(0,1fr)}

  .real-hero{padding:17px 20px}.real-hero .hero-copy h1{font-size:34px}.real-hero .hero-copy p{font-size:12px;line-height:1.45}.eyebrow{font-size:9px}.route-progress>div:first-child{font-size:10px}.route-progress small{font-size:9px}.hero-tags .tag{font-size:9px;padding:6px 8px}
  .next-card .card-title{font-size:12px}.next-copy h3{font-size:18px}.next-copy p{font-size:11px}.meta span{font-size:8px}.next-actions .btn{font-size:10px;height:38px}

  .lesson-card{padding:16px;overflow:hidden}.lesson-card .card-title{font-size:12px}.lesson-card .lesson-number{width:45px;height:45px;font-size:16px;margin:10px 0 8px}.lesson-card h2{font-size:25px;line-height:1.05;margin-bottom:8px}.lesson-card>p{font-size:12px;line-height:1.52}.lesson-card h4{font-size:11px;margin:12px 0 6px}.lesson-points li{font-size:10px;line-height:1.35;padding:3px 0 3px 15px}.lesson-card>.btn{height:38px;font-size:10px}

  .editor-head{height:40px;min-height:40px}.editor-head .card-title{font-size:13px}.runtime{font-size:9px}.tabs{height:32px;min-height:32px}.tab{font-size:9px}
  .code-wrap textarea{font-size:14px!important;line-height:27px!important;padding:11px 13px}.line-nos{font-size:10px!important;line-height:27px!important;padding:11px 8px}
  .editor-actions{min-height:46px;padding:7px;gap:6px}.editor-actions .btn{font-size:9px;padding:7px 9px}
  .console{height:145px;min-height:125px;flex:0 0 145px}.console-head{height:32px}.console-head strong{font-size:11px}.console pre{height:113px!important;font-size:11px!important;line-height:1.5!important;padding:9px 12px}

  .real-map-card .card-title{font-size:12px}.road-summary strong{font-size:13px}.road-summary small{font-size:9px}.road-percent{font-size:18px}.road-item{padding:6px 0}.road-index{width:26px;height:26px;font-size:9px}.road-copy strong{font-size:10px}.road-copy small{font-size:8px}.road-state{font-size:8px}.road-where strong{font-size:10px}.road-where p{font-size:8px;line-height:1.4}
}

@media (min-width:901px) and (max-height:850px){
  /* keep it readable; save space by reducing gaps instead of crushing text */
  .dashboard-grid.clean-dashboard{grid-template-rows:185px minmax(0,1fr);gap:7px;padding:7px 10px 9px}
  .real-hero .hero-copy h1{font-size:28px}.real-hero .hero-copy p{font-size:10px}.hero-objective-card{padding:10px}.hero-objective-card>strong{font-size:14px}.hero-objective-card>p{font-size:9px}.hero-tags{display:none}
  .lesson-card{padding:12px}.lesson-card h2{font-size:21px}.lesson-card>p{font-size:10px}.lesson-points li{font-size:9px}.lesson-card .lesson-number{width:38px;height:38px;font-size:13px}
  .code-wrap textarea{font-size:12px!important;line-height:24px!important}.line-nos{font-size:9px!important;line-height:24px!important}
  .console{height:112px;min-height:100px;flex-basis:112px}.console pre{height:80px!important;font-size:10px!important}
  .road-item{padding:4px 0}.road-copy strong{font-size:9px}.road-copy small{font-size:7px}.road-where{display:none}
}

@media(max-width:900px){
  .questguide-modal-message p{font-size:13px}.hero-readable{grid-template-columns:1fr!important}.hero-objective-card{margin-top:10px}
}

/* v11 · larger readable typography + wide search + soft rose accent */
:root{
  --rose:#ff5fa2;
  --rose-soft:#ff86b9;
  --rose-glow:rgba(255,95,162,.18);
}

@media (min-width:901px){
  /* topbar: search owns all free horizontal space */
  .topbar{gap:14px;padding-left:16px;padding-right:16px}
  .search{flex:1 1 auto;width:auto!important;max-width:none!important;min-width:260px;height:42px;border-color:#334a69;background:linear-gradient(180deg,#0d1a2b,#0b1726)}
  .search:focus-within{border-color:var(--rose);box-shadow:0 0 0 3px var(--rose-glow),inset 0 1px 0 rgba(255,255,255,.03)}
  .search>span{color:var(--rose-soft)}
  .search input{font-size:14px!important}
  .search kbd{font-size:10px}
  .top-stats{margin-left:0;flex:0 0 auto}
  .profile-chip{flex:0 0 auto}

  /* left navigation */
  .nav-item{font-size:15px!important;font-weight:700}
  .nav-item.active{box-shadow:inset 3px 0 0 var(--rose),0 10px 25px rgba(0,0,0,.12)}

  /* hero / route */
  .eyebrow{color:var(--rose-soft)!important;font-size:10px!important}
  .real-hero .hero-copy h1{font-size:36px!important;line-height:1.02}
  .real-hero .hero-copy p{font-size:13px!important;line-height:1.5}
  .route-progress>div:first-child{font-size:11px!important}
  .route-progress small{font-size:10px!important;line-height:1.4}
  .progress-track span{background:linear-gradient(90deg,var(--rose),var(--amber),var(--violet))}
  .hero-objective-card{border-color:rgba(255,95,162,.28)}
  .hero-objective-card>span{color:var(--rose-soft)!important;font-size:11px!important}
  .hero-objective-card>strong{font-size:18px!important}
  .hero-objective-card>p{font-size:13px!important;line-height:1.5}

  /* next card */
  .next-card .card-title{font-size:13px!important}
  .next-copy h3{font-size:20px!important;line-height:1.1}
  .next-copy p{font-size:12px!important;line-height:1.48}
  .meta span{font-size:9px!important}
  .next-actions .btn{font-size:11px!important}

  /* lesson */
  .lesson-card .card-title{font-size:13px!important}
  .lesson-card h2{font-size:28px!important;line-height:1.08}
  .lesson-card>p{font-size:13px!important;line-height:1.58}
  .lesson-card h4{font-size:12px!important;color:var(--rose-soft)!important}
  .lesson-points li{font-size:11px!important;line-height:1.42;padding-top:4px;padding-bottom:4px}
  .lesson-points li:before{color:var(--rose)!important}
  .lesson-card>.btn{font-size:11px!important}

  /* editor / console */
  .editor-head .card-title{font-size:14px!important}
  .runtime{font-size:10px!important}
  .tab{font-size:10px!important}
  .code-wrap textarea{font-size:15px!important;line-height:29px!important}
  .line-nos{font-size:11px!important;line-height:29px!important}
  .editor-actions .btn{font-size:10px!important}
  .console-head strong{font-size:12px!important}
  .console pre{font-size:12px!important;line-height:1.52!important}

  /* route map */
  .real-map-card .card-title{font-size:13px!important}
  .road-summary strong{font-size:15px!important}
  .road-summary small{font-size:10px!important;line-height:1.35}
  .road-percent{font-size:21px!important;color:var(--rose-soft)!important}
  .road-copy strong{font-size:12px!important;line-height:1.2}
  .road-copy small{font-size:9px!important;line-height:1.25}
  .road-state{font-size:9px!important}
  .road-item.current .road-index{background:linear-gradient(135deg,#ec4f9a,#9768ff);border-color:#ffadd0;box-shadow:0 0 0 5px var(--rose-glow)}
  .road-item.current .road-state{background:#48213a;color:#ffd7e9;border-color:#a84276}
  .road-where{border-color:rgba(255,95,162,.20)}
  .road-where strong{font-size:11px!important;color:var(--rose-soft)}
  .road-where p{font-size:9px!important;line-height:1.5}

  /* side cards */
  .mission-card strong,.focus-card strong,.support-card strong{font-size:12px!important}
  .mission-card p,.focus-card small,.support-card small{font-size:10px!important;line-height:1.35}
}

/* low desktop screens: keep no-scroll, but do not crush typography */
@media (min-width:901px) and (max-height:850px){
  .search input{font-size:13px!important}
  .real-hero .hero-copy h1{font-size:30px!important}
  .real-hero .hero-copy p{font-size:11px!important}
  .hero-objective-card>strong{font-size:15px!important}.hero-objective-card>p{font-size:10px!important}
  .next-copy h3{font-size:17px!important}.next-copy p{font-size:10px!important}
  .lesson-card h2{font-size:23px!important}.lesson-card>p{font-size:11px!important}.lesson-points li{font-size:10px!important;padding-top:2px;padding-bottom:2px}
  .code-wrap textarea{font-size:13px!important;line-height:25px!important}.line-nos{font-size:10px!important;line-height:25px!important}
  .console pre{font-size:10px!important}
  .road-copy strong{font-size:10px!important}.road-copy small{font-size:8px!important}.road-state{font-size:8px!important}.road-summary strong{font-size:13px!important}.road-summary small{font-size:9px!important}
}


/* v12 · Mobile app shell: navegación fija, solo el contenido se desplaza */
.mobile-appbar,.mobile-searchbar,.mobile-drawer,.mobile-drawer-backdrop,.mobile-bottom-nav{display:none}

@media (max-width:900px){
  :root{--mobile-top:62px;--mobile-search:0px;--mobile-bottom:66px}
  html,body{height:100%;min-height:100%;overflow:hidden!important}
  body{min-height:0;background:#07111f}
  body.mobile-drawer-open{overflow:hidden!important}

  .mobile-appbar{
    display:grid;grid-template-columns:42px 1fr 42px 38px;align-items:center;gap:8px;
    position:fixed;z-index:120;left:0;right:0;top:0;height:var(--mobile-top);padding:8px 12px;
    background:rgba(7,18,31,.96);backdrop-filter:blur(18px);border-bottom:1px solid #223750;
    box-shadow:0 10px 26px rgba(0,0,0,.22)
  }
  .mobile-menu-btn,.mobile-search-btn,.mobile-drawer-close{border:1px solid #29405d;background:#101e31;color:#f5efe8;border-radius:11px;height:40px;display:grid;place-items:center;font-size:20px}
  .mobile-brand{display:flex;align-items:center;gap:8px;text-decoration:none;font-weight:900;font-size:20px;letter-spacing:-.7px}.mobile-brand img{width:36px;height:36px}.mobile-brand>span>span{color:#ffad4b}
  .mobile-user-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:900;background:linear-gradient(145deg,#ec9e55,#7658d0);border:2px solid rgba(255,186,106,.55)}

  .mobile-searchbar{
    display:flex;position:fixed;z-index:115;left:10px;right:10px;top:calc(var(--mobile-top) + 8px);height:48px;
    padding:0 12px;align-items:center;gap:9px;border:1px solid #334a69;border-radius:13px;background:#0d1a2b;
    box-shadow:0 14px 34px rgba(0,0,0,.28);transform:translateY(-18px);opacity:0;pointer-events:none;transition:.2s ease
  }
  .mobile-searchbar.open{transform:translateY(0);opacity:1;pointer-events:auto}
  .mobile-searchbar span{color:#ff86b9;font-size:20px}.mobile-searchbar input{flex:1;min-width:0;border:0;background:transparent;outline:0;color:#fff;font-size:15px}

  .app-shell{display:block!important;height:100dvh!important;min-height:0!important;overflow:hidden!important;padding:0!important}
  .sidebar{display:none!important}
  .main{display:block!important;height:100dvh!important;min-height:0!important;overflow:hidden!important;padding:0!important}
  .topbar{display:none!important}
  .footer{display:none!important}

  .dashboard-grid.clean-dashboard{
    position:fixed;left:0;right:0;top:var(--mobile-top);bottom:var(--mobile-bottom);
    display:flex!important;flex-direction:column!important;gap:12px!important;
    height:auto!important;min-height:0!important;overflow-x:hidden!important;overflow-y:auto!important;
    padding:12px 12px 18px!important;scroll-padding-top:12px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain
  }
  .dashboard-grid.clean-dashboard>.slot,.dashboard-grid.clean-dashboard>.slot>.module-host{height:auto!important;min-height:0!important;max-height:none!important;width:100%!important}
  .clean-dashboard .hero-card,.clean-dashboard .next-card,.clean-dashboard .lesson-card,.clean-dashboard .editor-card,.clean-dashboard .real-map-card{height:auto!important;min-height:0!important;max-height:none!important}

  /* orden móvil: ruta → siguiente → lección → editor → hoja de ruta */
  .hero-slot{order:1}.clean-dashboard #slot-next{order:2}.lesson-slot{order:3}.editor-slot{order:4}.map-slot{order:5}

  .real-hero,.hero-readable{display:block!important;padding:18px!important}.real-hero .hero-copy h1{font-size:30px!important}.real-hero .hero-copy p{font-size:14px!important}.hero-objective-card{margin-top:14px;padding:14px!important}.hero-objective-card>strong{font-size:17px!important}.hero-objective-card>p{font-size:13px!important}
  .next-card{display:grid!important;grid-template-columns:52px 1fr!important;padding:16px!important;min-height:190px!important}.next-copy h3{font-size:20px!important}.next-copy p{font-size:13px!important}.next-actions{grid-column:1/3!important}.next-actions .btn{font-size:12px!important;height:42px!important}
  .lesson-card{padding:18px!important;overflow:visible!important}.lesson-card h2{font-size:28px!important}.lesson-card>p{font-size:14px!important;line-height:1.58!important}.lesson-card h4{font-size:13px!important}.lesson-points li{font-size:12px!important;line-height:1.45!important}.lesson-card>.btn{height:42px!important;font-size:12px!important}
  .editor-card{display:flex!important;flex-direction:column!important;overflow:hidden!important;min-height:560px!important}.editor-head{height:44px!important;min-height:44px!important}.editor-head .card-title{font-size:14px!important}.tabs{height:36px!important;min-height:36px!important}.code-wrap{height:300px!important;min-height:300px!important;flex:0 0 300px!important;grid-template-columns:44px minmax(0,1fr)!important}.code-wrap textarea{font-size:15px!important;line-height:28px!important}.line-nos{width:44px!important;min-width:44px!important;font-size:11px!important;line-height:28px!important}.editor-actions{flex-wrap:wrap!important;padding:8px!important}.editor-actions .btn{font-size:11px!important;padding:8px 10px!important}.console{height:150px!important;min-height:150px!important;flex:0 0 150px!important}.console pre{height:116px!important;font-size:12px!important}
  .real-map-card{padding:16px!important;overflow:visible!important}.road-summary strong{font-size:15px!important}.road-summary small{font-size:11px!important}.road-item{padding:8px 0!important}.road-copy strong{font-size:12px!important}.road-copy small{font-size:10px!important}.road-state{font-size:9px!important}.road-where{display:block!important}.road-where p{font-size:10px!important}

  .mobile-bottom-nav{
    display:grid;grid-template-columns:repeat(5,1fr);position:fixed;z-index:120;left:0;right:0;bottom:0;height:var(--mobile-bottom);
    padding:5px 8px max(5px,env(safe-area-inset-bottom));background:rgba(8,20,34,.98);backdrop-filter:blur(18px);border-top:1px solid #273b55;box-shadow:0 -10px 30px rgba(0,0,0,.25)
  }
  .mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;color:#8396ac;border-radius:10px;font-size:18px}.mobile-bottom-nav a small{font-size:10px;font-weight:700}.mobile-bottom-nav a.active{color:#ffb45c;background:linear-gradient(180deg,rgba(255,95,162,.10),rgba(255,173,75,.06))}

  .mobile-drawer-backdrop{display:block;position:fixed;z-index:130;inset:0;background:rgba(0,0,0,.58);opacity:0;pointer-events:none;transition:.2s}.mobile-drawer-backdrop.open{opacity:1;pointer-events:auto}
  .mobile-drawer{
    display:flex;flex-direction:column;position:fixed;z-index:140;left:0;top:0;bottom:0;width:min(82vw,330px);
    padding:14px;background:linear-gradient(180deg,#081523,#0b1929);border-right:1px solid #2a405b;box-shadow:22px 0 50px rgba(0,0,0,.38);
    transform:translateX(-102%);transition:transform .24s ease;overflow:auto
  }
  .mobile-drawer.open{transform:translateX(0)}
  .mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid #20344d}.mobile-drawer-head .brand{display:flex!important;height:auto!important}.mobile-drawer-close{width:40px}
  .mobile-drawer-nav{display:flex;flex-direction:column;gap:6px;padding:14px 0}.mobile-drawer-nav a{display:flex;align-items:center;gap:13px;height:46px;padding:0 13px;border-radius:12px;text-decoration:none;color:#d7e0ec;font-size:14px;font-weight:700}.mobile-drawer-nav a span{width:24px;text-align:center;color:#ffc16d}.mobile-drawer-nav a.active{background:linear-gradient(90deg,rgba(255,95,162,.14),rgba(125,89,224,.14));box-shadow:inset 3px 0 0 #ff5fa2}
  .mobile-drawer-bottom{margin-top:auto;padding-top:14px;border-top:1px solid #20344d}.mobile-drawer-user{display:flex;align-items:center;gap:10px}.mobile-drawer-user .avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#e99d54,#6f57c9);font-weight:900}.mobile-drawer-user small,.mobile-drawer-user strong{display:block}.mobile-drawer-user small{color:#8192a6;font-size:10px}.mobile-drawer-user strong{font-size:12px}.mobile-drawer-bottom .logout-link{display:block!important;margin-top:12px;padding:10px 0;font-size:11px}

  .daily-challenge-slot{z-index:150!important;left:12px!important;right:12px!important;bottom:calc(var(--mobile-bottom) + 12px)!important;width:auto!important;max-width:none!important}
}

@media (max-width:520px){
  .mobile-appbar{grid-template-columns:40px 1fr 40px 36px;padding-left:9px;padding-right:9px}.mobile-brand{font-size:18px}.mobile-brand img{width:32px;height:32px}
  .dashboard-grid.clean-dashboard{padding-left:9px!important;padding-right:9px!important}.real-hero .hero-copy h1{font-size:27px!important}.lesson-card h2{font-size:25px!important}.code-wrap{height:270px!important;min-height:270px!important;flex-basis:270px!important}
}


/* v12.2 · HARD DESKTOP GUARD
   Mobile chrome can never leak into desktop. */
@media (min-width: 901px) {
  .mobile-appbar,
  .mobile-searchbar,
  .mobile-drawer,
  .mobile-drawer-backdrop,
  .mobile-bottom-nav {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html, body {
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    overflow: hidden !important;
  }

  .app-shell {
    display: grid !important;
    grid-template-columns: 232px minmax(0, 1fr) !important;
    width: 100vw !important;
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
  }

  .sidebar {
    display: flex !important;
    position: relative !important;
    top: auto !important;
    width: 232px !important;
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .sidebar .brand {
    display: flex !important;
    height: 52px !important;
    font-size: 22px !important;
  }

  .sidebar .brand img {
    display: block !important;
    width: 43px !important;
    height: 43px !important;
    max-width: 43px !important;
    max-height: 43px !important;
    object-fit: contain !important;
    flex: 0 0 43px !important;
  }

  .main {
    display: grid !important;
    grid-template-rows: 64px minmax(0, 1fr) !important;
    width: auto !important;
    height: 100vh !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
  }

  .topbar {
    display: flex !important;
    position: relative !important;
    top: auto !important;
    height: 64px !important;
    min-height: 64px !important;
    overflow: hidden !important;
  }

  .dashboard-grid.clean-dashboard {
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .footer { display: none !important; }
}

/* v12.3 · MOBILE FLOW RESET
   Mobile shell stays fixed; dashboard cards use normal document flow. */
@media (max-width: 900px) {
  html, body {
    height: 100% !important;
    min-height: 100% !important;
    overflow: hidden !important;
  }

  .app-shell,
  .main {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .dashboard-grid.clean-dashboard {
    position: fixed !important;
    inset: var(--mobile-top) 0 var(--mobile-bottom) 0 !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    padding: 12px 10px 26px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
  }

  .dashboard-grid.clean-dashboard > .slot,
  .dashboard-grid.clean-dashboard > .slot > .module-host {
    display: block !important;
    position: static !important;
    inset: auto !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 0 12px !important;
    overflow: visible !important;
    transform: none !important;
  }

  /* Explicit mobile order without relying on desktop grid areas. */
  .hero-slot { order: initial !important; }
  #slot-next { order: initial !important; }
  .lesson-slot { order: initial !important; }
  .editor-slot { order: initial !important; }
  .map-slot { order: initial !important; }

  .clean-dashboard .card,
  .clean-dashboard .hero-card,
  .clean-dashboard .next-card,
  .clean-dashboard .lesson-card,
  .clean-dashboard .editor-card,
  .clean-dashboard .real-map-card {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    transform: none !important;
  }

  /* Route/current level */
  .real-hero,
  .hero-readable {
    display: block !important;
    padding: 18px !important;
  }
  .real-hero .hero-copy,
  .hero-readable .hero-copy {
    display: block !important;
    width: 100% !important;
  }
  .real-hero .hero-copy h1 { font-size: 29px !important; line-height: 1.06 !important; }
  .real-hero .hero-copy p { font-size: 14px !important; line-height: 1.5 !important; }
  .hero-objective-card {
    display: block !important;
    width: 100% !important;
    margin-top: 14px !important;
    padding: 15px !important;
  }

  /* Next lesson must be a full card, never a desktop-height remnant. */
  .next-card {
    display: grid !important;
    grid-template-columns: 52px minmax(0,1fr) !important;
    gap: 10px 12px !important;
    min-height: 0 !important;
    padding: 16px !important;
  }
  .next-card .card-title,
  .next-card .next-actions,
  .next-card > .btn { grid-column: 1 / -1 !important; }
  .next-copy h3 { font-size: 20px !important; }
  .next-copy p { font-size: 13px !important; }

  /* Lesson is allowed to grow naturally. */
  .lesson-card {
    display: block !important;
    padding: 18px !important;
    overflow: hidden !important;
  }
  .lesson-card h2 { font-size: 27px !important; line-height: 1.08 !important; }
  .lesson-card > p { font-size: 14px !important; line-height: 1.58 !important; }
  .lesson-card h4 { font-size: 13px !important; }
  .lesson-points { margin-bottom: 14px !important; }
  .lesson-points li { font-size: 12px !important; line-height: 1.48 !important; padding-top: 5px !important; padding-bottom: 5px !important; }
  .lesson-card > .btn {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: 44px !important;
    margin: 16px 0 0 !important;
  }

  /* Editor owns its own vertical space and cannot overlap neighbors. */
  .editor-card {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  .editor-head { flex: 0 0 46px !important; height: 46px !important; }
  .tabs { flex: 0 0 38px !important; height: 38px !important; }
  .code-wrap {
    display: grid !important;
    grid-template-columns: 44px minmax(0,1fr) !important;
    flex: 0 0 300px !important;
    width: 100% !important;
    height: 300px !important;
    min-height: 300px !important;
    overflow: hidden !important;
  }
  .line-nos {
    position: static !important;
    width: 44px !important;
    min-width: 44px !important;
    overflow: hidden !important;
  }
  .code-wrap textarea {
    position: static !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    font-size: 15px !important;
    line-height: 28px !important;
    white-space: pre !important;
    overflow: auto !important;
  }
  .editor-actions {
    position: static !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    padding: 9px !important;
  }
  .editor-actions .btn { font-size: 11px !important; padding: 9px 10px !important; }
  .console {
    position: static !important;
    display: block !important;
    flex: 0 0 160px !important;
    width: 100% !important;
    height: 160px !important;
    min-height: 160px !important;
    overflow: hidden !important;
  }
  .console pre {
    width: 100% !important;
    height: 124px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    overflow: auto !important;
  }

  /* Roadmap follows editor in normal flow. */
  .real-map-card {
    display: block !important;
    padding: 16px !important;
    overflow: hidden !important;
  }
  .road-list { display: block !important; min-height: 0 !important; }
  .road-item { padding: 9px 0 !important; }
  .road-copy strong { font-size: 12px !important; }
  .road-copy small { font-size: 10px !important; line-height: 1.35 !important; }
  .road-where { display: block !important; margin-top: 14px !important; }
  .road-where p { font-size: 11px !important; line-height: 1.5 !important; }
}

@media (max-width: 520px) {
  .dashboard-grid.clean-dashboard { padding-left: 8px !important; padding-right: 8px !important; }
  .real-hero .hero-copy h1 { font-size: 27px !important; }
  .lesson-card h2 { font-size: 25px !important; }
  .code-wrap { height: 270px !important; min-height: 270px !important; flex-basis: 270px !important; }
}


/* v12.4 · CodeIntegrity global anti-paste */
.integrity-module-host{display:none!important}
.editor-head-badges{display:flex;align-items:center;gap:7px}
.integrity-pill{display:inline-flex;align-items:center;gap:5px;border:1px solid rgba(255,177,79,.28);background:rgba(255,177,79,.08);color:#ffd08a;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:800;white-space:nowrap}
.integrity-backdrop{z-index:1700}
.integrity-modal{width:min(500px,92vw);border-color:rgba(255,177,79,.35);background:radial-gradient(circle at 20% 0,rgba(255,177,79,.12),transparent 35%),radial-gradient(circle at 100% 20%,rgba(219,83,151,.12),transparent 32%),linear-gradient(145deg,#101e32,#0b1728)}
.integrity-shield{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;font-size:30px;margin-bottom:13px;background:linear-gradient(145deg,#ffb24c,#db5397);box-shadow:0 14px 35px rgba(255,133,91,.2)}
.integrity-modal h2{font-size:28px;margin:7px 0 9px}
.integrity-modal>p{font-size:14px;line-height:1.6;color:#d5deea;margin-bottom:16px}
.integrity-modal>p strong{color:#ffd38e}
.integrity-rule{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;padding:12px 13px;margin-bottom:16px;border-radius:12px;border:1px solid #314762;background:#0a1728}
.integrity-rule>span{font-size:22px}.integrity-rule strong{display:block;font-size:12px}.integrity-rule small{display:block;margin-top:3px;color:#91a4ba;font-size:10px;line-height:1.45}
@media(max-width:900px){.editor-head-badges{gap:5px}.integrity-pill{font-size:9px;padding:5px 7px}.integrity-modal{padding:20px}.integrity-modal h2{font-size:24px}.integrity-modal>p{font-size:13px}}


/* === PySky auth identity v12.5 === */
.cq-auth-identity .auth-art{background:
  radial-gradient(circle at 25% 68%,rgba(255,111,104,.18),transparent 24%),
  radial-gradient(circle at 76% 18%,rgba(154,91,255,.24),transparent 30%),
  linear-gradient(145deg,#0b1628 0%,#12172d 46%,#201932 100%)}
.cq-auth-identity .auth-art:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.018) 50%,transparent 100%)}
.cq-manifest{top:28%;max-width:650px}
.cq-manifest h1{font-size:58px;line-height:.98;letter-spacing:-2.7px;margin:13px 0 18px}
.cq-manifest h1 span{color:#ffd9b2}
.cq-manifest .manifest-lead{font-size:15px;line-height:1.65;color:#d7dfeb;max-width:620px;margin-bottom:22px}
.cq-manifest .manifest-lead strong{color:#fff;font-size:17px}
.integrity-manifest{position:relative;max-width:610px;padding:18px 20px 19px;border:1px solid rgba(255,100,161,.34);border-radius:16px;background:linear-gradient(135deg,rgba(48,24,49,.78),rgba(17,28,48,.82));box-shadow:0 18px 45px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.03)}
.integrity-manifest:before{content:"";position:absolute;left:0;top:17px;bottom:17px;width:3px;border-radius:99px;background:linear-gradient(180deg,#ff5fa2,#ffae4d)}
.integrity-title{display:flex;align-items:center;gap:8px;color:#ff87ba;text-transform:uppercase;letter-spacing:1.15px;font-size:10px}
.integrity-title>span{font-size:15px}.integrity-manifest>p{margin:11px 0 12px;color:#e3e8ef;font-size:13px;line-height:1.72}.integrity-final{padding-top:11px;border-top:1px solid rgba(255,255,255,.08);color:#ffd4e5;font-size:14px;font-weight:650;line-height:1.5}.integrity-final b{color:#ffb061}
.cq-auth-card{width:min(460px,92%);padding:34px 32px}.auth-mini-eyebrow{display:inline-block;margin-bottom:8px;color:#ff9c65;font-size:9px;font-weight:850;letter-spacing:1.4px}.cq-auth-card h2{font-size:31px;letter-spacing:-.8px}.cq-auth-card>p{font-size:12px;line-height:1.5}.cq-auth-card label{font-size:11px}.cq-auth-card input{font-size:13px;padding:12px 13px}.cq-auth-card .btn{min-height:44px;font-size:11px}.ready-box{margin-top:16px;padding:11px 12px;border-radius:11px;border:1px solid rgba(255,176,73,.18);background:linear-gradient(135deg,rgba(255,170,70,.07),rgba(148,83,238,.07))}.ready-box strong,.ready-box span{display:block}.ready-box strong{color:#ffe2bd;font-size:10px}.ready-box span{color:#91a0b2;font-size:9px;margin-top:4px;line-height:1.45}
@media(max-width:900px){.cq-auth-identity.auth-shell{display:block;min-height:100vh;overflow:auto}.cq-auth-identity .auth-art{min-height:auto;padding:20px 18px 28px}.cq-auth-identity .brand-large{font-size:22px}.cq-auth-identity .auth-copy{position:relative;left:auto;top:auto;margin:42px 0 0;max-width:none}.cq-manifest h1{font-size:38px;letter-spacing:-1.5px}.cq-manifest .manifest-lead{font-size:13px}.cq-manifest .manifest-lead strong{font-size:15px}.integrity-manifest{padding:15px 16px}.integrity-manifest>p{font-size:12px}.integrity-final{font-size:12px}.cq-auth-identity .auth-panel{padding:24px 16px 38px}.cq-auth-card{width:100%;max-width:470px;padding:24px}}

/* v13 · Rango 1 Recluta */
.lesson-xp{margin-left:auto;color:#ffd08a;background:rgba(255,177,79,.09);border:1px solid rgba(255,177,79,.2);border-radius:999px;padding:5px 8px;font-size:9px;font-weight:900}
.range-complete-card{background:radial-gradient(circle at 25% 20%,rgba(57,209,135,.12),transparent 28%),linear-gradient(145deg,#10243a,#101a2d)}
.range-complete-card .lesson-number{background:linear-gradient(145deg,#28b879,#58d89f)!important;color:#061b12!important}
.range-next-card .lesson-badge{background:linear-gradient(145deg,#ec4f9a,#9768ff)}
@media (min-width:901px){
  .real-map-card .road-item{padding:4px 0!important}
  .real-map-card .road-copy strong{font-size:10px!important;line-height:1.2}
  .real-map-card .road-copy small{font-size:7px!important;line-height:1.2}
  .real-map-card .road-summary{margin-top:7px!important;padding:8px!important}
  .real-map-card .road-where{margin-top:5px!important;padding:7px!important}
  .lesson-card .lesson-points{margin-bottom:8px!important}
}
@media(max-width:900px){.lesson-xp{font-size:10px;padding:5px 8px}}

/* v13.1 · QuestGuide diagnostic + PySky program input */
.questguide-analysis,.result-diagnostic{white-space:pre-wrap;font-family:Inter,system-ui,sans-serif;margin:6px 0 0;color:#e7edf6;font-size:13px;line-height:1.65;background:transparent;border:0;overflow:visible}
.mastery-result-modal .result-diagnostic{margin:10px 0 15px;color:#d8e1ec}.mastery-result-modal.failure .result-diagnostic{padding:13px 14px;border-radius:12px;background:rgba(127,58,81,.12);border:1px solid rgba(255,139,163,.16)}
.cq-input-backdrop{position:fixed;inset:0;z-index:1800;display:grid;place-items:center;padding:18px;background:rgba(2,8,18,.78);backdrop-filter:blur(9px)}
.cq-input-modal{width:min(500px,94vw);padding:25px;border-radius:18px;border:1px solid #49617f;background:radial-gradient(circle at 50% 0,rgba(255,132,177,.12),transparent 36%),linear-gradient(145deg,#101e32,#0b1728);box-shadow:0 28px 90px rgba(0,0,0,.58)}
.cq-input-modal h2{margin:7px 0 8px;font-size:23px}.cq-input-question{margin:0 0 16px;color:#fff0d4;font-size:16px;font-weight:750;line-height:1.45}.cq-input-modal label{display:block;margin-bottom:7px;color:#9eafc4;font-size:11px}.cq-program-input{width:100%;height:48px;padding:0 13px;border:1px solid #456184;border-radius:11px;background:#081524;color:#fff;outline:0;font-size:14px}.cq-program-input::placeholder{color:#6f829a}.cq-program-input:focus{border-color:#ff9a67;box-shadow:0 0 0 3px rgba(255,154,103,.12)}.cq-input-actions{display:flex;gap:10px;margin-top:16px}.cq-input-actions .btn{flex:1;min-height:42px}
@media(max-width:600px){.cq-input-actions{flex-direction:column-reverse}.cq-input-question{font-size:15px}}

/* PySky v14 · práctica positiva + negativa */
.practice-format-pill{display:inline-flex;align-items:center;gap:7px;margin:8px 0 12px;padding:6px 10px;border:1px solid rgba(255,183,77,.28);border-radius:999px;background:rgba(255,183,77,.07);font-size:.78rem;font-weight:800;letter-spacing:.03em;color:#ffd39a}.negative-preview{border:1px solid rgba(232,121,249,.18);background:linear-gradient(135deg,rgba(232,121,249,.055),rgba(255,183,77,.035));border-radius:14px;padding:14px}.negative-preview .class-step{color:#f0a4dc}.questguide-modal-message pre{white-space:pre-wrap;line-height:1.55}.editor-card .mastery-validate{font-weight:900}.lesson-class-modal .class-code{line-height:1.5}
.reference-modal{width:min(900px,94vw);max-height:88vh;overflow:auto}.reference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}.reference-grid article{padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025)}.reference-grid h3{margin:0 0 8px}.reference-grid p{margin:0 0 10px}.reference-grid pre{white-space:pre-wrap;background:#090f1d;border-radius:10px;padding:10px;overflow:auto}@media(max-width:700px){.reference-grid{grid-template-columns:1fr}}

/* v14.1 · misión persistente + QuestGuide/GymBro */
.lesson-active-instruction{margin:10px 0 12px;padding:11px 12px;border-radius:12px;border:1px solid rgba(255,181,72,.30);background:linear-gradient(135deg,rgba(255,181,72,.075),rgba(236,72,153,.055));}
.lesson-active-instruction[hidden]{display:none!important}
.instruction-kicker{display:block;font-size:9px;font-weight:900;letter-spacing:.14em;color:#f7a8d3;margin-bottom:5px}
.instruction-phase{display:block;color:#ffd08a;font-size:11px;margin-bottom:4px}
.lesson-active-instruction p{margin:0!important;color:#e4eaf2!important;font-size:10.5px!important;line-height:1.48!important}
.questguide-close-note{text-align:center;margin:9px 0 0;color:#8090a5;font-size:10px}
.questguide-backdrop.gymbro-active{backdrop-filter:blur(8px)}
.questguide-backdrop.gymbro-active .questguide-modal{box-shadow:0 26px 90px rgba(0,0,0,.58),0 0 0 1px rgba(255,183,77,.12)}
@media(max-width:900px){.lesson-active-instruction{padding:12px}.instruction-kicker{font-size:10px}.instruction-phase{font-size:12px}.lesson-active-instruction p{font-size:12px!important}}

/* v15 · left nav panels + achievements console */
.hub-modal{width:min(980px,94vw);max-height:min(88vh,860px);padding:24px 24px 20px;overflow:auto;background:linear-gradient(180deg,#0d1a2e,#0a1526 72%,#0d1828);border:1px solid rgba(123,148,192,.22)}
.hub-title{margin:8px 0 14px;font-size:30px;line-height:1.05}
.hub-content{display:grid;gap:16px}
.hub-copy-block{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(220px,.7fr);gap:14px;align-items:start}
.hub-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(255,178,76,.11);border:1px solid rgba(255,178,76,.25);color:#ffca7d;font-size:11px;font-weight:800;letter-spacing:.08em}
.hub-copy-block h3,.profilehub-head h3{margin:10px 0 8px;font-size:22px}.hub-copy-block p,.profilehub-head p,.hub-note{margin:0;color:#c4d0df;font-size:13px;line-height:1.55}
.hub-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hub-metric-grid.profile{grid-template-columns:repeat(4,minmax(0,1fr))}
.hub-metric-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}
.hub-metric-grid>div{padding:14px;border-radius:16px;border:1px solid rgba(117,142,186,.18);background:linear-gradient(180deg,rgba(21,31,49,.86),rgba(14,22,37,.92));box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.hub-metric-grid strong{display:block;font-size:24px;line-height:1.05;color:#fff}.hub-metric-grid small{display:block;margin-top:6px;color:#9db0c7;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.roadboard-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}.roadboard-item{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;border:1px solid rgba(123,148,192,.16);background:linear-gradient(180deg,rgba(17,26,42,.9),rgba(11,19,33,.96))}
.roadboard-index{width:44px;height:44px;border-radius:14px;background:#1a2740;display:grid;place-items:center;font-weight:900;color:#ffc671}.roadboard-item strong{display:block;font-size:14px}.roadboard-item small{display:block;margin-top:4px;color:#97abc2}.roadboard-flag{padding:7px 10px;border-radius:999px;background:#1b2941;color:#c7d4e6;font-size:11px;font-weight:800;letter-spacing:.08em}
.roadboard-item.done .roadboard-index{background:linear-gradient(135deg,#2b5f4b,#27513e);color:#c9ffdd}.roadboard-item.current .roadboard-index{background:linear-gradient(135deg,#5d43ba,#8a67f8);color:#fff}.roadboard-item.next .roadboard-index{background:linear-gradient(135deg,#614829,#ffb24c);color:#fff}
.lessonhub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.lessonhub-card{padding:16px;border-radius:18px;border:1px solid rgba(123,148,192,.15);background:linear-gradient(180deg,rgba(17,26,42,.9),rgba(11,19,33,.96))}.lessonhub-card strong{display:block;font-size:16px;margin:8px 0}.lessonhub-card p{margin:0 0 12px;color:#c1cddd;font-size:13px;line-height:1.5}.lessonhub-card .lessonhub-top{font-size:11px;color:#ffcb82;font-weight:800;letter-spacing:.08em}.lessonhub-card.done{border-color:rgba(62,209,135,.25)}.lessonhub-card.current{border-color:rgba(138,103,248,.35);box-shadow:0 0 0 1px rgba(138,103,248,.18)}
.project-timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.project-step{padding:16px;border-radius:18px;border:1px solid rgba(123,148,192,.15);background:linear-gradient(180deg,rgba(17,26,42,.9),rgba(11,19,33,.96))}.project-step strong{display:block;font-size:16px}.project-step small{display:block;margin-top:6px;color:#a4b6cb}.project-step.done{border-color:rgba(62,209,135,.24)}.project-step.current{border-color:rgba(255,178,76,.28)}
.playground-card{padding:18px;border-radius:18px;border:1px solid rgba(123,148,192,.16);background:linear-gradient(180deg,rgba(17,26,42,.9),rgba(11,19,33,.96))}.playground-card strong{display:block;font-size:17px}.playground-card ul{margin:10px 0 14px;padding-left:18px;color:#c4d0df}.playground-card li{margin:7px 0}
.profilehub-head{display:grid;grid-template-columns:78px minmax(0,1fr);gap:14px;align-items:center}.profilehub-avatar{width:78px;height:78px;border-radius:22px;display:grid;place-items:center;font-size:32px;font-weight:900;background:linear-gradient(135deg,#8a67f8,#46d4d0);box-shadow:0 14px 28px rgba(0,0,0,.35)}
.achievement-console{display:grid;gap:12px}.achievement-card{display:grid;grid-template-columns:66px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;border-radius:18px;border:1px solid rgba(123,148,192,.14);background:linear-gradient(180deg,rgba(17,26,42,.95),rgba(11,19,33,.98))}.achievement-card.locked{opacity:.92}.achievement-card.unlocked{box-shadow:0 0 0 1px rgba(255,214,126,.12),0 14px 30px rgba(0,0,0,.22)}
.achievement-icon{width:66px;height:66px;border-radius:18px;display:grid;place-items:center;font-size:30px;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.16),transparent 35%),linear-gradient(145deg,#2b3857,#161f32)}
.achievement-copy span{display:block;color:#9ab0c6;font-size:11px;font-weight:800;letter-spacing:.08em}.achievement-copy strong{display:block;margin:4px 0 6px;font-size:17px}.achievement-copy p{margin:0;color:#c3d0de;font-size:13px;line-height:1.48}.achievement-state{font-size:22px;font-weight:900;color:#ffc166}
.achievement-card.tier-bronze .achievement-icon{background:linear-gradient(145deg,#5e4a34,#291f17)}.achievement-card.tier-silver .achievement-icon{background:linear-gradient(145deg,#5a687b,#202a37)}.achievement-card.tier-gold .achievement-icon{background:linear-gradient(145deg,#7d6022,#37280d)}.achievement-card.tier-platinum .achievement-icon{background:linear-gradient(145deg,#6b53cd,#281f53)}.achievement-card.tier-secret .achievement-icon{background:linear-gradient(145deg,#345e73,#17293a)}
.trophy-burst-root{position:fixed;right:22px;top:22px;z-index:2600;pointer-events:none}
.trophy-burst{position:relative;overflow:hidden;display:grid;grid-template-columns:80px minmax(0,1fr);gap:14px;align-items:center;width:min(440px,calc(100vw - 30px));padding:16px 18px;border-radius:24px;background:linear-gradient(140deg,rgba(13,24,40,.98),rgba(24,17,39,.98));border:1px solid rgba(255,194,102,.36);box-shadow:0 18px 60px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.04);transform:translateY(-18px) scale(.92);opacity:0;animation:burstIn .42s cubic-bezier(.18,.8,.23,1) forwards}
.trophy-burst.fade{animation:burstOut .45s ease forwards}.burst-glow,.burst-rays{position:absolute;inset:-20%;pointer-events:none}.burst-glow{background:radial-gradient(circle at 20% 20%,rgba(255,208,123,.28),transparent 24%),radial-gradient(circle at 84% 18%,rgba(70,212,208,.18),transparent 20%),radial-gradient(circle at 50% 80%,rgba(138,103,248,.18),transparent 22%)}.burst-rays{background:conic-gradient(from 0deg, transparent 0 8%, rgba(255,215,136,.11) 8% 10%, transparent 10% 18%, rgba(255,215,136,.09) 18% 20%, transparent 20% 28%, rgba(255,215,136,.11) 28% 30%, transparent 30% 100%);animation:spinSlow 7s linear infinite;opacity:.7}
.burst-trophy{position:relative;z-index:1;width:80px;height:80px;border-radius:22px;display:grid;place-items:center;font-size:42px;background:linear-gradient(145deg,rgba(255,205,117,.22),rgba(43,57,87,.55));box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 8px 18px rgba(0,0,0,.35)}
.burst-copy{position:relative;z-index:1}.burst-copy span{display:block;color:#ffd28a;font-size:11px;font-weight:900;letter-spacing:.12em}.burst-copy strong{display:block;margin:6px 0 4px;font-size:20px}.burst-copy p{margin:0;color:#d6e0ec;font-size:13px;line-height:1.45}
@keyframes burstIn{from{transform:translateY(-18px) scale(.92);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}
@keyframes burstOut{from{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(-10px) scale(.96);opacity:0}}
@keyframes spinSlow{to{transform:rotate(360deg)}}

@media (max-width:900px){
  .hub-modal{width:min(96vw,96vw);padding:20px 16px 16px}.hub-title{font-size:24px}.hub-copy-block,.profilehub-head{grid-template-columns:1fr}.hub-metric-grid.profile{grid-template-columns:repeat(2,minmax(0,1fr))}.lessonhub-grid,.project-timeline{grid-template-columns:1fr}.achievement-card{grid-template-columns:56px minmax(0,1fr)}.achievement-state{display:none}.achievement-icon{width:56px;height:56px;font-size:25px}.trophy-burst-root{padding:12px}.trophy-burst{width:min(96vw,96vw);grid-template-columns:74px minmax(0,1fr);padding:20px 18px}.burst-trophy{width:74px;height:74px;font-size:38px}.burst-copy strong{font-size:22px}.burst-copy p{font-size:14px}.burst-congrats{font-size:13px}
}

/* v15.1 · achievement celebration must stay above QuestCode / input / integrity modals */
.trophy-burst:before,.trophy-burst:after{content:"✦  ✧  ✦  ✧  ✦";position:absolute;z-index:2;left:18px;right:18px;top:10px;color:#ffd477;font-size:16px;letter-spacing:11px;text-shadow:0 0 12px rgba(255,205,108,.95);animation:sparkPop 1.2s ease-in-out infinite alternate;pointer-events:none}
.trophy-burst:after{top:auto;bottom:10px;color:#71e7df;animation-delay:.35s;transform:scaleX(-1)}
@keyframes sparkPop{from{opacity:.24;filter:blur(.2px);transform:translateY(1px) scale(.96)}to{opacity:1;filter:blur(0);transform:translateY(-2px) scale(1.04)}}

/* v15.3 · achievement burst anchored directly to viewport */
#cq-trophy-burst-root.trophy-burst-root{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100vh!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
  z-index:99999!important;
  pointer-events:none!important;
  transform:none!important;
  margin:0!important;
}
#cq-trophy-burst-root.trophy-burst-root::before{
  position:absolute!important;
  inset:0!important;
}
#cq-trophy-burst-root .trophy-burst{
  margin:auto!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  max-width:min(620px, calc(100vw - 48px))!important;
}
@media (max-width:900px){
  #cq-trophy-burst-root.trophy-burst-root{
    padding:14px!important;
  }
}


/* v15.4 · achievement celebration owns the screen while visible */
#cq-trophy-burst-root.trophy-burst-root{
  pointer-events:none!important;
  visibility:hidden;
}
#cq-trophy-burst-root.trophy-burst-root.active{
  pointer-events:auto!important;
  visibility:visible;
  cursor:default;
}
#cq-trophy-burst-root.trophy-burst-root.active::before{
  background:radial-gradient(circle at center,rgba(30,42,70,.28),rgba(3,7,14,.82))!important;
  backdrop-filter:blur(4px)!important;
}
body.achievement-celebrating{overflow:hidden!important;user-select:none!important;}

.cq-build-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 7px;border:1px solid rgba(255,178,76,.28);border-radius:999px;color:#ffca7d;background:rgba(255,178,76,.08);font-size:9px;font-weight:900;letter-spacing:.08em}
@media(max-width:900px){.cq-build-badge{display:none}}

/* v20.0 · pedagogía primero vocabulario + estado de prueba persistente */
.lesson-class-section.concept-first{border-color:rgba(255,178,76,.34);background:linear-gradient(135deg,rgba(56,39,35,.72),rgba(26,29,48,.86));box-shadow:inset 0 0 0 1px rgba(255,178,76,.06)}
.word-card{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:10px;align-items:center;margin:10px 0;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,178,76,.22);background:rgba(8,17,31,.52)}
.word-card code{font-size:18px;color:#ffcb7e;font-weight:800}.word-card>span{color:#8397af;font-size:12px}.word-card strong{font-size:14px}.word-card small{grid-column:3;color:#9fb1c6;font-size:11px;line-height:1.45}
.concept-table{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:12px 0}.concept-table>span{display:grid;grid-template-columns:minmax(74px,auto) 1fr;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;border:1px solid rgba(115,145,187,.18);background:rgba(7,16,29,.54)}.concept-table code{color:#ffbf69;font-size:14px;font-weight:800}.concept-table b{font-size:12px}.concept-table small{grid-column:2;color:#96aabe;font-size:10px}
.code-anatomy{display:grid;gap:7px;margin-top:12px}.code-anatomy p{margin:0;padding:8px 10px;border-left:2px solid rgba(138,103,248,.7);background:rgba(13,23,39,.58);font-size:12px;line-height:1.5}
.flow-strip{display:grid;grid-template-columns:1fr auto 1fr auto 1.4fr;gap:8px;align-items:center;margin:10px 0;padding:10px 12px;border-radius:12px;background:rgba(62,209,135,.08);border:1px solid rgba(62,209,135,.16);font-size:12px;font-weight:700}.flow-strip.muted{background:rgba(255,111,119,.06);border-color:rgba(255,111,119,.13)}.flow-strip b{color:#ffbe68;text-align:center}
.class-progress-note{min-height:18px;margin:0 0 9px;color:#b8c7d7;font-size:11px;line-height:1.45;text-align:center}
@media(max-width:700px){.concept-table{grid-template-columns:1fr}.word-card{grid-template-columns:auto auto 1fr}.flow-strip{grid-template-columns:1fr auto 1fr;}.flow-strip span:last-child{grid-column:1/-1;text-align:center}.flow-strip b:last-of-type{display:none}}

/* v20.0 · first-login transmission + Quester contract */
.onboarding-shell{min-height:100vh;position:relative;overflow:hidden;display:grid;place-items:center;padding:36px 18px;background:radial-gradient(circle at 18% 12%,rgba(130,86,255,.18),transparent 34%),radial-gradient(circle at 82% 82%,rgba(255,151,70,.14),transparent 32%),#07111f;color:#eef4ff}.onboarding-grid{position:fixed;inset:0;pointer-events:none;opacity:.2;background-image:linear-gradient(rgba(114,143,181,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(114,143,181,.14) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,black,transparent 90%)}.onboarding-stage{position:relative;z-index:1;width:min(760px,94vw)}.onboarding-stage[hidden]{display:none}.cq-letter{position:relative;padding:42px 46px 34px;border-radius:8px;background:linear-gradient(180deg,#fff7df,#f3e3ba);color:#2c241b;border:1px solid #d4bd83;box-shadow:0 32px 100px rgba(0,0,0,.46),inset 0 0 60px rgba(154,115,53,.08);transform:rotate(-.35deg)}.cq-letter:before{content:'';position:absolute;inset:12px;border:1px dashed rgba(106,78,34,.3);pointer-events:none}.letter-stamp{position:absolute;right:34px;top:28px;width:62px;height:62px;border:3px double #9c5c3d;border-radius:50%;display:grid;place-items:center;font:900 18px/1 'JetBrains Mono',monospace;color:#9c5c3d;transform:rotate(12deg)}.letter-kicker{display:block;font:800 10px/1.4 'JetBrains Mono',monospace;letter-spacing:1.4px;color:#8b6842;margin-bottom:18px}.cq-letter h1{font-size:38px;line-height:1.05;margin:0 90px 20px 0}.cq-letter p{font-size:15px;line-height:1.75;color:#4b3d2c}.letter-sign{font-weight:800;margin:20px 0 26px}.letter-meta{display:block;text-align:center;margin-top:14px;font:700 9px/1.4 'JetBrains Mono',monospace;color:#8b775b;letter-spacing:.8px}.cq-contract{padding:28px;border-radius:18px;border:1px solid #344e70;background:linear-gradient(180deg,rgba(14,28,48,.98),rgba(7,17,31,.99));box-shadow:0 28px 90px rgba(0,0,0,.5)}.contract-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding-bottom:20px;border-bottom:1px solid #29415f}.contract-head span{font:800 9px/1.4 'JetBrains Mono',monospace;letter-spacing:1.2px;color:#ffb75f}.contract-head h1{font-size:30px;margin:6px 0 0}.contract-head>strong{font:800 11px/1 'JetBrains Mono',monospace;color:#9b87ff;border:1px solid #574693;border-radius:999px;padding:9px 11px}.contract-lead{color:#b7c4d5;line-height:1.65}.contract-clause{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:16px 0;border-bottom:1px solid rgba(71,97,132,.3)}.contract-clause>b{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#13263f;border:1px solid #2e4c72;color:#ffc16d;font-family:'JetBrains Mono',monospace}.contract-clause strong{font-size:13px}.contract-clause p{margin:5px 0 0;color:#9eafc4;font-size:11px;line-height:1.6}.contract-warning{margin:20px 0;padding:14px 16px;border-radius:13px;border:1px solid rgba(255,170,84,.27);background:rgba(255,157,69,.08)}.contract-warning span{font:900 9px/1 'JetBrains Mono',monospace;color:#ffb66f;letter-spacing:1px}.contract-warning p{margin:7px 0 0;color:#e1c29d;font-size:11px;line-height:1.55}.contract-check{display:flex!important;gap:12px;align-items:flex-start;margin:20px 0!important;padding:15px;border:1px solid #324c6c;border-radius:13px;background:#0b192b;color:#dce7f4!important;font-size:11px!important;line-height:1.55}.contract-check input{margin-top:2px;accent-color:#ff9e4b}.contract-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}.contract-hash{display:block;text-align:center;margin-top:16px;color:#617792;font:700 8px/1.4 'JetBrains Mono',monospace;letter-spacing:.7px}.admin-root-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;border:1px solid rgba(255,93,160,.34);background:rgba(255,73,142,.09);color:#ff92be;font:900 8px/1 'JetBrains Mono',monospace;letter-spacing:.9px}.admin-root-link{color:#ff9fc3!important}.admin-root-link span{color:#ff74aa!important}.admin-portal-grid{display:grid;gap:14px}.admin-portal-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding:14px;border:1px solid rgba(255,101,164,.22);border-radius:14px;background:linear-gradient(135deg,rgba(255,76,145,.08),rgba(116,81,229,.08))}.admin-portal-head strong{display:block;font-size:15px}.admin-portal-head p{margin:5px 0 0;color:#9fb0c4;font-size:10px;line-height:1.55}.admin-step-group{border:1px solid #273c58;border-radius:14px;overflow:hidden}.admin-step-group>strong{display:block;padding:10px 12px;background:#0d1b2e;color:#ffc275;font-size:10px;letter-spacing:.6px}.admin-step-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#22364f}.admin-step-btn{border:0;background:#0c1727;color:#dbe6f2;text-align:left;padding:11px 12px;cursor:pointer}.admin-step-btn:hover{background:#13243b}.admin-step-btn.current{background:linear-gradient(135deg,#34275f,#382244);box-shadow:inset 3px 0 #ff7cad}.admin-step-btn small{display:block;margin-top:3px;color:#71869f;font-size:8px}.admin-step-btn b{font-family:'JetBrains Mono',monospace;color:#ffb65e;margin-right:7px}.admin-users-table{display:grid;gap:7px}.admin-user-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid #263b56;border-radius:11px;background:#0b1727}.admin-user-row small{color:#7890aa}.admin-role{font:800 8px/1 'JetBrains Mono',monospace;border-radius:999px;padding:6px 8px;background:#14243b;color:#aabbd0}.admin-role.admin{background:rgba(255,85,151,.12);color:#ff9ac2}.admin-view-note{color:#ffca83;font-size:9px;line-height:1.5}.admin-phase-actions{display:flex;gap:8px}.admin-phase-actions[hidden]{display:none}.admin-phase-actions .btn{flex:1}
@media(max-width:700px){.cq-letter{padding:34px 24px 28px}.cq-letter h1{font-size:30px;margin-right:54px}.letter-stamp{width:48px;height:48px;right:22px;top:22px}.cq-contract{padding:20px}.contract-head h1{font-size:23px}.contract-actions{display:grid}.admin-step-list{grid-template-columns:1fr}}

/* v20.3 · post-checkpoint transmission / rank protocol */
.rank-transition-shell{display:block;width:100%;min-width:0}.rank-transition-shell .rank-letter{min-height:520px;display:flex;flex-direction:column;justify-content:center}.rank-transition-shell .rank-contract{width:100%;max-height:none}.rank-transition-shell .contract-clause{grid-template-columns:44px minmax(0,1fr)}.protocol-code{margin:12px 0 0;padding:12px 14px;border-radius:10px;border:1px solid rgba(118,158,207,.24);background:#071321;color:#d7e7f7;font:700 11px/1.65 'JetBrains Mono',monospace;white-space:pre-wrap;overflow:auto}.rank-contract code{padding:2px 5px;border-radius:6px;background:#101f33;color:#ffce8a;font-family:'JetBrains Mono',monospace}.protocol-editor-lock{min-height:300px}.protocol-lock-copy{min-height:235px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px}.protocol-lock-copy span{font:900 9px/1 'JetBrains Mono',monospace;letter-spacing:1.5px;color:#ffb96c}.protocol-lock-copy strong{margin:12px 0 8px;font-size:20px}.protocol-lock-copy p{max-width:520px;margin:0;color:#91a6bf;font-size:12px;line-height:1.7}.rank-transition-shell .contract-check input:disabled+span{opacity:.6}
@media(max-width:900px){.rank-transition-shell .rank-letter{min-height:auto}.rank-transition-shell .contract-clause{grid-template-columns:38px minmax(0,1fr)}.protocol-code{font-size:10px}}

/* v20.3 · shared-slot layout guard
   Modules that intentionally render nothing must not consume the fixed dashboard row. */
.rank-transition-inactive,
.lesson-module-inactive{display:none!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:hidden!important}

/* v21.0 · protocol signature accessibility fix
   The dashboard is a fixed viewport. Contracts longer than the viewport must scroll
   inside their own card so the acceptance checkbox and signature action are reachable. */
.rank-transition-shell{height:100%;min-height:0;overflow:hidden}
.rank-transition-shell .rank-contract{max-height:calc(100vh - 92px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding-bottom:20px}
.rank-transition-shell .rank-contract::-webkit-scrollbar{width:9px}
.rank-transition-shell .rank-contract::-webkit-scrollbar-thumb{background:#385270;border-radius:999px;border:2px solid #0b1728}
.rank-transition-shell .contract-actions{position:sticky;bottom:-1px;z-index:5;margin:0 -10px;padding:14px 10px 4px;background:linear-gradient(180deg,rgba(7,17,31,0),rgba(7,17,31,.98) 28%)}
.rank-transition-shell .contract-check{scroll-margin-bottom:92px}
@media(max-width:900px){.rank-transition-shell{height:auto;overflow:visible}.rank-transition-shell .rank-contract{max-height:calc(100dvh - 78px)}.rank-transition-shell .contract-actions{bottom:0}}

/* v23.0 · protocol signature dock: scroll rules, keep acceptance controls always visible */
.rank-transition-shell .rank-contract{height:100%;max-height:calc(100vh - 92px);overflow:hidden!important;padding:0!important;display:flex;flex-direction:column;min-height:0}
.rank-transition-shell .rank-contract[hidden]{display:none!important}
.rank-transition-shell .rank-contract-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:28px 28px 10px}
.rank-transition-shell .rank-contract-scroll::-webkit-scrollbar{width:9px}
.rank-transition-shell .rank-contract-scroll::-webkit-scrollbar-thumb{background:#385270;border-radius:999px;border:2px solid #0b1728}
.rank-transition-shell .rank-contract-footer{flex:0 0 auto;position:relative;z-index:8;padding:12px 28px 18px;border-top:1px solid #29415f;background:linear-gradient(180deg,#0b192b,#07111f);box-shadow:0 -16px 28px rgba(0,0,0,.24)}
.rank-transition-shell .rank-contract-footer .contract-check{margin:0 0 10px!important}
.rank-transition-shell .rank-contract-footer .contract-actions{position:static!important;margin:0!important;padding:0!important;background:none!important}
.rank-transition-shell .rank-contract-footer .contract-hash{margin-top:10px}
@media(max-width:900px){.rank-transition-shell .rank-contract{height:min(820px,calc(100dvh - 78px));max-height:calc(100dvh - 78px)}.rank-transition-shell .rank-contract-scroll{padding:20px 20px 8px}.rank-transition-shell .rank-contract-footer{padding:10px 20px 14px}.rank-transition-shell .rank-contract-footer .contract-actions{display:grid}}

/* v23.0 · hard protocol dock + ROOT quick access rescue
   The transition lesson shares a fixed-height dashboard cell. The signature controls
   are anchored to the card itself so they cannot be pushed below the viewport. */
.clean-dashboard .lesson-slot .module-rank_transition,
.clean-dashboard .lesson-slot .module-rank_transition .rank-transition-shell{
  position:relative!important;
  height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
}
.rank-transition-shell .rank-contract{
  position:relative!important;
  height:100%!important;
  max-height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
  padding:0!important;
}
.rank-transition-shell .rank-contract-scroll{
  position:absolute!important;
  inset:0!important;
  overflow-y:auto!important;
  padding:28px 28px 190px!important;
  scrollbar-gutter:stable;
}
.rank-transition-shell .rank-contract-footer{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  z-index:30!important;
  max-height:178px;
  overflow:auto;
  padding:12px 28px 16px!important;
  border-top:1px solid #395371!important;
  background:linear-gradient(180deg,rgba(12,27,46,.985),rgba(5,14,26,.995))!important;
  box-shadow:0 -18px 36px rgba(0,0,0,.48)!important;
}
.rank-transition-shell .rank-contract-footer .contract-check{
  margin:0 0 9px!important;
  padding:10px 12px!important;
}
.rank-transition-shell .rank-contract-footer .contract-actions{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  gap:8px!important;
}
.rank-transition-shell .rank-contract-footer .sign-rank-protocol{
  min-height:38px;
}
.admin-quick-access{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:12px 0 2px;
}
.admin-quick-btn{
  border:1px solid #354c69;
  border-radius:11px;
  background:#0d1a2d;
  color:#dfe9f5;
  padding:10px 9px;
  text-align:left;
  cursor:pointer;
  font-size:9px;
  font-weight:800;
}
.admin-quick-btn:hover{background:#15263e;transform:translateY(-1px)}
.admin-quick-btn b{display:block;color:#ffbd69;font-size:11px;margin-bottom:3px}
.admin-quick-btn.root-new{border-color:rgba(255,105,166,.35);background:linear-gradient(135deg,rgba(255,84,148,.1),rgba(111,79,222,.1))}
.admin-portal-backdrop .hub-modal{overflow:auto!important}
.admin-portal-content{min-height:0}
@media(max-width:900px){
  .rank-transition-shell .rank-contract-scroll{position:relative!important;inset:auto!important;height:calc(100% - 168px);padding:20px 20px 24px!important}
  .rank-transition-shell .rank-contract-footer{position:absolute!important;max-height:168px;padding:10px 20px 12px!important}
  .rank-transition-shell .rank-contract-footer .contract-actions{grid-template-columns:1fr!important}
  .admin-quick-access{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.protocol-sign-kicker{margin:0 0 7px;color:#ffbd70;font:900 8px/1 'JetBrains Mono',monospace;letter-spacing:1px}

/* v23.0 · ROOT catalog inspection: ranges 1-6 are explicit, stage-by-stage */
.admin-catalog-help{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 13px;border:1px solid #2a4362;border-radius:12px;background:#0b1829}
.admin-catalog-help strong{color:#ffbd69;font:900 9px/1 'JetBrains Mono',monospace;letter-spacing:1px}
.admin-catalog-help span{color:#8fa5bd;font-size:9px;text-align:right}
.admin-group-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 12px;background:#0d1b2e;border-bottom:1px solid #243a56}
.admin-group-head>div{display:grid;grid-template-columns:auto 1fr;column-gap:9px;align-items:center}
.admin-group-head strong{color:#ffc275;font-size:11px}
.admin-group-head small{grid-column:2;color:#71869f;font-size:8px;margin-top:2px}
.admin-group-code{grid-row:1/3;display:grid;place-items:center;min-width:34px;height:34px;padding:0 7px;border:1px solid #355273;border-radius:9px;background:#10233a;color:#ff9fc3;font:900 9px/1 'JetBrains Mono',monospace}
.admin-open-first{font-size:9px;padding:7px 9px;white-space:nowrap}
.admin-step-btn span{font-weight:700}
.admin-step-group.admin-group-flash{box-shadow:0 0 0 2px rgba(255,110,170,.55),0 0 28px rgba(255,79,148,.18)}
.admin-quick-btn{cursor:pointer}
.admin-portal-backdrop .hub-modal{max-width:min(1120px,94vw)!important}
@media(max-width:700px){.admin-catalog-help{display:block}.admin-catalog-help span{display:block;text-align:left;margin-top:6px}.admin-group-head{align-items:flex-start}.admin-group-head>div{grid-template-columns:auto 1fr}}

/* v23.0 · Deep Dive pedagógico */
.deep-dive-launch{margin:14px 0;padding:13px;border:1px dashed rgba(255,185,108,.32);border-radius:14px;background:linear-gradient(135deg,rgba(255,185,108,.06),rgba(139,92,246,.05))}.deep-dive-launch small{display:block;margin-top:7px;text-align:center;color:#8297b1;font-size:9px}.lesson-deep-dive{margin:16px 0;padding:14px;border:1px solid rgba(155,113,255,.34);border-radius:16px;background:linear-gradient(160deg,#0a1627,#12162f)}.deep-dive-head{position:sticky;top:-26px;z-index:3;display:flex;align-items:center;gap:10px;margin:-14px -14px 14px;padding:12px 14px;background:rgba(8,19,34,.97);border-bottom:1px solid rgba(155,113,255,.26);backdrop-filter:blur(8px)}.deep-dive-head span{font:900 9px/1 'JetBrains Mono',monospace;letter-spacing:1.4px;color:#ffb96c}.deep-dive-head strong{flex:1;font-size:12px}.deep-dive-head .btn{font-size:9px;padding:6px 9px}.lesson-deep-dive .lesson-class-section{margin-bottom:10px}.lesson-deep-dive .class-code{font-size:11px}.mental-trace{display:grid;gap:7px;margin-top:8px}.mental-trace>div{padding:9px 11px;border-left:3px solid #8b5cf6;border-radius:0 9px 9px 0;background:#091728;color:#b9c8da;font-size:10px;line-height:1.55}.mental-trace b{color:#ffd08a}.build-steps{counter-reset:cqstep;display:grid;gap:8px;margin-top:8px}.build-steps>div{position:relative;padding:9px 10px 9px 40px;border:1px solid #263c57;border-radius:10px;background:#081524;color:#b9c8da;font-size:10px;line-height:1.55}.build-steps>div:before{counter-increment:cqstep;content:counter(cqstep);position:absolute;left:10px;top:9px;width:20px;height:20px;display:grid;place-items:center;border-radius:6px;background:#6245d8;color:white;font:900 9px/1 'JetBrains Mono',monospace}
/* v23.0 · pedagogy core */
.cq-foundation{border-color:rgba(255,185,108,.3)!important;background:linear-gradient(135deg,rgba(255,185,108,.06),rgba(8,21,36,.45))}.deep-rule{margin-top:10px;padding:10px 12px;border-left:3px solid #ffb96c;border-radius:0 10px 10px 0;background:#081524;color:#b9c8da}.lesson-deep-dive .class-step{min-width:42px}

/* v27.1 · Pedagogy Remaster: explicación obligatoria antes del ejemplo */
.cq-guided-foundation{margin:0 0 16px;padding:16px;border:1px solid rgba(255,185,108,.30);border-radius:16px;background:linear-gradient(145deg,rgba(255,185,108,.08),rgba(139,92,246,.06),rgba(7,19,33,.86))}
.cq-guided-kicker{margin-bottom:8px;color:#ffb96c;font:900 9px/1.2 'JetBrains Mono',monospace;letter-spacing:1.35px;text-transform:uppercase}
.cq-guided-foundation h3{margin:0 0 8px;font-size:15px}.cq-guided-foundation>p{margin:0 0 12px;color:#c5d2e3;line-height:1.65}
.cq-source-map{padding:9px 11px;border-left:3px solid #8b5cf6;border-radius:0 10px 10px 0;background:#081524;color:#9fb2c9;font-size:9px;line-height:1.55}
.cq-source-map b{color:#d7c8ff}.cq-mental-model{margin-top:10px;padding:11px 12px;border:1px solid #263c57;border-radius:11px;background:rgba(5,16,29,.68)}
.cq-mental-model strong{color:#ffcf89;font-size:10px}.cq-mental-model p{margin:5px 0 0;color:#b9c8da;font-size:10px;line-height:1.6}
.cq-vocab-row,.cq-vocab-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.cq-vocab-row span,.cq-vocab-grid span{padding:5px 8px;border:1px solid rgba(139,92,246,.35);border-radius:999px;background:rgba(139,92,246,.08);color:#d5c9ff;font:800 9px/1 'JetBrains Mono',monospace}
.cq-foundation-questions{display:grid;gap:6px;margin-top:10px}.cq-foundation-questions div{padding:7px 9px;border-radius:8px;background:#081524;color:#aebfd3;font-size:9px;line-height:1.45}
.book-map{margin-top:9px;padding:8px 10px;border-radius:9px;background:#081524;color:#96aac1;font-size:9px}.book-map b{color:#ffcf89}
.lesson-class-content>.cq-guided-foundation+ .lesson-class-section{margin-top:0}
@media(max-width:700px){.cq-guided-foundation{padding:13px}.cq-vocab-row span,.cq-vocab-grid span{font-size:8px}}



/* v25 · lesson modal shell: content scrolls, actions stay visible */
.lesson-class-modal{display:flex!important;flex-direction:column!important;width:min(780px,94vw)!important;height:min(88vh,900px)!important;max-height:88vh!important;overflow:hidden!important;padding:0!important}
.lesson-class-modal>.modal-close{position:absolute;right:14px;top:12px;z-index:20}
.lesson-class-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:26px 26px 18px;scrollbar-gutter:stable}
.lesson-class-scroll>.modal-kicker{padding-right:42px}
.lesson-class-modal .class-footer{position:relative!important;inset:auto!important;flex:0 0 auto;margin:0!important;padding:12px 18px 14px!important;background:linear-gradient(180deg,#0d1a2d,#091522)!important;border-top:1px solid #2a405e;box-shadow:0 -14px 34px rgba(1,8,18,.34);z-index:15}
.class-progress-note{min-height:18px;margin:0 0 8px;text-align:center;color:#9fb3cb;font-size:10px;line-height:1.45}
.admin-phase-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.admin-phase-actions[hidden]{display:none!important}
.admin-phase-actions .btn,.class-footer>.continue-mastery{min-height:38px}
.lesson-class-scroll .deep-dive-head{top:0}
@media(max-width:700px){.lesson-class-modal{height:92vh!important;max-height:92vh!important}.lesson-class-scroll{padding:20px 18px 14px}.lesson-class-modal .class-footer{padding:10px 12px 12px!important}.admin-phase-actions{grid-template-columns:1fr}}


/* v27.2 · QuestWorkspace */
.workspace-badge{margin-left:8px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;border:1px solid rgba(168,105,255,.48);padding:3px 7px;border-radius:999px;color:#d7bfff;background:rgba(115,64,180,.15)}
.workspace-tabs{display:flex;gap:4px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;padding-right:8px}.workspace-tabs .tab{white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis}.workspace-tabs .tab.generated{color:#82efc2}.workspace-tabs .tab.plus{min-width:34px;font-weight:900;color:#ffb65a}.workspace-context{padding:5px 12px;font-size:10px;color:#9db0c6;border-bottom:1px solid var(--line);background:#081728}.workspace-context b{color:#ffb65a;letter-spacing:.05em}.read-only-file{background:linear-gradient(180deg,rgba(17,39,61,.55),rgba(8,25,41,.35));color:#aabbd0}.workspace-file-chips{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.workspace-file-chip{font-family:var(--mono);font-size:11px;border:1px solid #29445f;background:#08192a;border-radius:8px;padding:5px 8px}.workspace-file-chip.provided{border-color:#604484;color:#d8c3ff}.workspace-file-chip.resource{border-color:#35506c;color:#b9d6ef}.workspace-file-chip.user{border-color:#4c735f;color:#a7efca}.workspace-plus-note{padding:9px 11px;border-left:3px solid #ff9f45;background:rgba(255,159,69,.07)}.quest-workspace-brief{border-color:rgba(135,85,210,.55)!important;background:linear-gradient(145deg,rgba(85,52,142,.10),rgba(13,33,51,.65))!important}.cq-new-file-modal .file-error{min-height:18px;color:#ff7c9e;display:block;margin-top:5px}


/* v27.2 · Hero vertical rhythm — same geometry for every lesson/range
   The route copy used to be vertically centered, so longer/shorter descriptions
   moved progress, tags and objective controls up/down. Keep narrative at the top
   and navigation/status anchored at the bottom. */
@media (min-width:901px){
  .clean-dashboard .real-hero.hero-readable{
    align-items:stretch!important;
  }
  .clean-dashboard .real-hero.hero-readable .hero-copy.solo{
    min-width:0;
    min-height:0;
    height:100%;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    align-items:stretch!important;
    overflow:hidden;
  }
  .clean-dashboard .real-hero.hero-readable .hero-copy.solo>.eyebrow{
    flex:0 0 auto;
  }
  .clean-dashboard .real-hero.hero-readable .hero-copy.solo>h1{
    flex:0 0 auto;
  }
  .clean-dashboard .real-hero.hero-readable .hero-copy.solo>p{
    flex:0 0 auto;
    margin-bottom:7px!important;
  }
  .clean-dashboard .real-hero.hero-readable .route-progress{
    flex:0 0 auto;
    margin-top:auto!important;
  }
  .clean-dashboard .real-hero.hero-readable .hero-tags{
    flex:0 0 auto;
    margin-top:7px!important;
    min-height:26px;
    align-items:center;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card{
    min-width:0;
    min-height:0;
    height:100%;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    align-items:stretch!important;
    overflow:hidden;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>span,
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>strong,
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>p{
    flex:0 0 auto;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card .hero-tip{
    margin-top:auto!important;
    width:100%;
    flex:0 0 auto;
  }
}

/* Low desktop heights hide decorative tags consistently instead of letting
   content length decide what gets pushed out. Progress/navigation stay aligned. */
@media (min-width:901px) and (max-height:850px){
  .clean-dashboard .real-hero.hero-readable .hero-tags{
    display:none!important;
    min-height:0!important;
    margin:0!important;
  }
  .clean-dashboard .real-hero.hero-readable .hero-copy.solo>p{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>p{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    overflow:hidden;
  }
}

/* Mobile goes back to natural document flow: no artificial anchoring. */
@media (max-width:900px){
  .clean-dashboard .real-hero.hero-readable .hero-copy.solo,
  .clean-dashboard .real-hero.hero-readable .hero-objective-card{
    height:auto!important;
    overflow:visible!important;
  }
  .clean-dashboard .real-hero.hero-readable .route-progress,
  .clean-dashboard .real-hero.hero-readable .hero-objective-card .hero-tip{
    margin-top:12px!important;
  }
}


/* v27.3 · Objective CTA lock
   The hero body is already stable; the remaining drift came from the CTA button
   sharing vertical space with variable title/description blocks. Give the
   objective card explicit rows so the button always lives in the last slot. */
@media (min-width:901px){
  .clean-dashboard .real-hero.hero-readable .hero-objective-card{
    display:grid!important;
    grid-template-rows:auto auto minmax(0,1fr) auto!important;
    gap:8px!important;
    align-content:stretch!important;
    justify-content:stretch!important;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>span,
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>strong,
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>p,
  .clean-dashboard .real-hero.hero-readable .hero-objective-card .hero-tip{
    margin:0!important;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>strong{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    min-height:0;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>p{
    min-height:0;
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card .hero-tip{
    align-self:stretch!important;
    width:100%!important;
    margin-top:0!important;
  }
}

@media (min-width:901px) and (max-height:850px){
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>strong{
    -webkit-line-clamp:2;
  }
  .clean-dashboard .real-hero.hero-readable .hero-objective-card>p{
    -webkit-line-clamp:3;
  }
}


/* v28.2 · Transition letter two-row layout
   The paper is a real two-row component: scrolling content + non-overlapping CTA footer.
   No sticky/absolute button can cover copy. Applies to current and future transitions. */
@media (min-width:901px){
  .clean-dashboard .lesson-slot .module-rank_transition,
  .clean-dashboard .lesson-slot .module-rank_transition .rank-transition-shell{
    min-height:0!important;
    height:100%!important;
  }
  .clean-dashboard .lesson-slot .module-rank_transition .rank-letter{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-rows:minmax(0,1fr) auto!important;
    padding:0!important;
  }
  .clean-dashboard .lesson-slot .module-rank_transition .rank-letter-scroll{
    position:relative;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
    padding:28px 30px 18px;
  }
  .clean-dashboard .lesson-slot .module-rank_transition .rank-letter-scroll::-webkit-scrollbar{width:9px}
  .clean-dashboard .lesson-slot .module-rank_transition .rank-letter-scroll::-webkit-scrollbar-thumb{
    background:rgba(139,104,66,.45);
    border-radius:999px;
    border:2px solid rgba(255,247,223,.72);
  }
  .clean-dashboard .lesson-slot .module-rank_transition .rank-letter-footer{
    position:relative;
    z-index:4;
    display:grid;
    gap:7px;
    padding:12px 30px 18px;
    border-top:1px solid rgba(132,91,45,.20);
    background:linear-gradient(180deg,rgba(255,247,223,.97),#fff0c7 92%);
    box-shadow:0 -14px 28px rgba(102,65,19,.08);
  }
  .clean-dashboard .lesson-slot .module-rank_transition .rank-letter-footer .open-rank-protocol{
    position:static!important;
    margin:0!important;
    width:100%;
    box-shadow:0 10px 22px rgba(65,42,12,.18)!important;
  }
  .clean-dashboard .lesson-slot .module-rank_transition .rank-letter-footer .letter-meta{
    display:block;
    margin:0;
    text-align:center;
    line-height:1.25;
  }
}

@media (max-width:900px){
  .rank-transition-shell .rank-letter{
    max-height:calc(100dvh - 92px)!important;
    min-height:0!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-rows:minmax(0,1fr) auto!important;
    padding:0!important;
  }
  .rank-transition-shell .rank-letter-scroll{
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    padding:24px 20px 16px;
  }
  .rank-transition-shell .rank-letter-footer{
    display:grid;
    gap:7px;
    padding:10px 20px 16px;
    border-top:1px solid rgba(132,91,45,.20);
    background:#fff1cc;
  }
  .rank-transition-shell .rank-letter-footer .open-rank-protocol{
    position:static!important;
    margin:0!important;
    width:100%;
  }
  .rank-transition-shell .rank-letter-footer .letter-meta{
    text-align:center;
    margin:0;
  }
}

/* v29 · QuestWorkspace SQLite inspector */
.graduation-slot{grid-column:1/-1}.graduation-card{display:grid;grid-template-columns:auto 1fr;gap:24px;border:1px solid rgba(168,85,247,.45);background:linear-gradient(135deg,rgba(76,29,149,.3),rgba(15,23,42,.92))}.graduation-card.graduated{border-color:rgba(245,158,11,.55)}.graduation-seal{font-size:58px;filter:drop-shadow(0 8px 18px rgba(245,158,11,.25))}.graduation-card h2,.graduation-joke h2{margin:6px 0 8px}.graduation-name{display:grid;gap:6px;margin:16px 0;font-weight:700}.graduation-name input{padding:12px;border-radius:10px;border:1px solid rgba(148,163,184,.35);background:#0f172a;color:#fff}.graduation-check{display:flex;gap:9px;align-items:flex-start;margin:14px 0}.graduation-check input{margin-top:4px}.graduation-stats{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.graduation-stats span{padding:8px 11px;border:1px solid rgba(196,181,253,.28);border-radius:999px}.graduation-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.graduation-legal{font-size:11px;opacity:.7;max-width:850px}.graduation-error{color:#fca5a5}.graduation-joke{text-align:center;border:1px solid #a855f7}.graduation-glitch{font-family:monospace;font-size:20px;color:#c084fc;font-weight:900}@media(max-width:700px){.graduation-card{grid-template-columns:1fr}.graduation-seal{font-size:42px}.graduation-actions a{width:100%;text-align:center}}
.db-inspector{position:absolute;inset:0;overflow:auto;padding:14px 16px;background:#091727;color:#dce8f5;font-family:Inter,system-ui,sans-serif}
.db-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;padding-bottom:12px;border-bottom:1px solid #223953}.db-toolbar>div{display:flex;flex-direction:column;gap:3px}.db-toolbar strong{font-size:13px}.db-toolbar select{background:#10233a;border:1px solid #34506f;color:#eaf2fb;border-radius:9px;padding:8px 10px;font-size:11px}
.db-view{padding:12px 0}.db-schema-line{border:1px solid #223953;border-radius:10px;padding:10px;margin-bottom:9px;background:#0d1d31}.db-schema-line>b{color:#ffb458;text-transform:uppercase;font-size:9px;letter-spacing:1px}.db-schema-line code{color:#c5a9ff}.db-schema-line pre{white-space:pre-wrap;margin:7px 0 0;font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;color:#adc1d5}
.db-table-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.db-table-head strong{font-size:14px}.db-table-head span{font-size:10px;color:#91a8c0}.db-grid-wrap{overflow:auto;border:1px solid #29425d;border-radius:10px}.db-grid{border-collapse:collapse;width:100%;font:11px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace}.db-grid th,.db-grid td{padding:8px 9px;border-right:1px solid #20364f;border-bottom:1px solid #20364f;text-align:left;white-space:nowrap}.db-grid th{position:sticky;top:0;background:#142741;color:#ffbe68}.db-grid td{color:#d4e1ed}.db-grid tr:last-child td{border-bottom:0}
.db-query-box{border-top:1px solid #223953;padding-top:12px;margin-top:8px}.db-query-box label{display:flex;justify-content:space-between;font-size:10px;font-weight:800;color:#ffbd62;margin-bottom:7px}.db-query-box label small{font-weight:500;color:#7891aa}.db-query-box>div{display:flex;gap:8px}.db-query-input{flex:1;min-width:0;background:#071321;border:1px solid #34506f;border-radius:9px;color:#dff2ff;padding:9px 10px;font:11px ui-monospace,SFMono-Regular,Consolas,monospace}.db-query-result{white-space:pre-wrap;max-height:170px;overflow:auto;background:#071321;border:1px solid #1f344b;border-radius:9px;padding:9px;margin:8px 0 0;color:#9ed7ba;font:10px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace}.db-error{color:#ff8f8f}

/* v29 · Era de los Reinos: darker medieval layer, still PySky */
body.era-reinos{--realm-fire:#d99742;--realm-ember:#8f4f2f;--realm-moss:#54644a;--realm-violet:#4d3a73;background:radial-gradient(circle at 80% 10%,rgba(92,51,31,.12),transparent 28%),#07111f}
body.era-reinos .real-hero{background:radial-gradient(circle at 78% 18%,rgba(217,151,66,.18),transparent 23%),radial-gradient(circle at 38% -12%,rgba(83,60,117,.28),transparent 32%),linear-gradient(120deg,#0a1524 0%,#17192a 48%,#33211f 100%)}
body.era-reinos .real-hero:before{content:"ᚱ ᚢ ᚾ ᛖ  ·  SQL  ·  ᛞ ᚨ ᛏ ᚨ";position:absolute;right:25px;bottom:10px;font:700 8px ui-monospace,Consolas,monospace;letter-spacing:5px;color:rgba(226,170,95,.13);pointer-events:none}
body.era-reinos .hero-objective-card{border-color:rgba(217,151,66,.25);background:linear-gradient(165deg,rgba(22,24,39,.96),rgba(45,28,30,.94))}
body.era-reinos .lesson-card,body.era-reinos .editor-card,body.era-reinos .real-map-card{box-shadow:inset 0 1px 0 rgba(235,176,96,.035),0 16px 45px rgba(0,0,0,.28)}
body.era-reinos .workspace-badge{color:#ffd18d;border-color:rgba(217,151,66,.35)}


/* v29.2 · SQLite Inspector containment
   The inspector is absolute by design, but its containing block must be the
   editor code area. Without this, inset:0 anchors against an ancestor/page and
   the DB inspector spills across the dashboard. */
.code-wrap{position:relative!important;}
.code-wrap>.db-inspector{
  position:absolute!important;
  inset:0!important;
  z-index:6!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  box-sizing:border-box!important;
  overflow:auto!important;
  grid-column:1 / -1!important;
}
.code-wrap>.db-inspector[hidden]{display:none!important;}

/* v29.3 · Pedagogy contract */
.pedagogy-contract{border-color:rgba(255,180,82,.28)!important;background:linear-gradient(145deg,rgba(45,34,25,.48),rgba(26,23,42,.58))!important}
.pedagogy-contract .class-step{background:linear-gradient(145deg,#9a5c21,#4f347b);color:#fff0cc}
.pedagogy-contract h3{margin-bottom:8px}
.pedagogy-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:12px;margin-top:12px}
.pedagogy-grid>div{border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:12px;background:rgba(8,17,30,.45)}
.pedagogy-grid strong{display:block;margin-bottom:7px;color:#ffd18c}
.pedagogy-grid ul{margin:0;padding-left:18px}.pedagogy-grid li{margin:4px 0}
.pedagogy-oath{margin-top:12px!important;padding:9px 11px;border-left:3px solid #ffad52;background:rgba(255,173,82,.07);border-radius:0 8px 8px 0}
.db-learning-empty,.db-query-locked{padding:13px;border:1px solid rgba(255,181,78,.24);border-radius:11px;background:rgba(255,181,78,.06)}
.db-learning-empty b,.db-query-locked b{color:#ffc971}.db-learning-empty p,.db-query-locked p{margin:6px 0 0;color:#aebed0;line-height:1.55}
@media(max-width:900px){.pedagogy-grid{grid-template-columns:1fr}}

/* v29.3 · Curriculum contract audit passed across R1–R9. */


/* v31.0 · Rango 10 · Estratega */
body.era-estratega{--council-gold:#e0ad58;--council-blood:#6d2430;--council-ink:#070b13;background:radial-gradient(circle at 70% 12%,rgba(109,36,48,.16),transparent 25%),#050b13}
body.era-estratega .real-hero{background:radial-gradient(circle at 74% 20%,rgba(224,173,88,.14),transparent 22%),radial-gradient(circle at 34% 0%,rgba(83,46,112,.24),transparent 30%),linear-gradient(122deg,#070d17 0%,#151322 50%,#35191e 100%)}
body.era-estratega .real-hero:before{content:"⚔  CONSILIUM  ·  QUERY  ·  DECIDE  ·  COMMIT  ⚔";position:absolute;right:22px;bottom:9px;font:700 8px ui-monospace,Consolas,monospace;letter-spacing:3px;color:rgba(224,173,88,.13);pointer-events:none}
body.era-estratega .hero-objective-card{border-color:rgba(224,173,88,.28);background:linear-gradient(165deg,rgba(17,18,31,.97),rgba(51,22,29,.95))}
body.era-estratega .lesson-card,body.era-estratega .editor-card,body.era-estratega .real-map-card{box-shadow:inset 0 1px 0 rgba(224,173,88,.045),0 18px 48px rgba(0,0,0,.32)}
body.era-estratega .workspace-badge{color:#ffd992;border-color:rgba(224,173,88,.4)}

/* v31 QuestCLI / Forge Arcana */
.quest-cli{border-top:1px solid #263c55;border-bottom:1px solid #263c55;background:#07131f;padding:7px 10px}.quest-cli-row{display:flex;align-items:center;gap:8px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.quest-cli-prompt{color:#f2ad4e;white-space:nowrap;font-weight:800}.quest-cli-input{flex:1;min-width:0;background:#0b1a2b;border:1px solid #334d68;border-radius:8px;color:#eaf4ff;padding:7px 9px;font:inherit}.quest-exit-code{border:1px solid #2d815e;color:#67e7aa;background:#0b2a20;border-radius:999px;padding:4px 8px;font-size:11px;font-weight:900}.quest-exit-code.bad{border-color:#9c495b;color:#ff819c;background:#30131c}.quest-env-row{margin-top:5px;display:flex;align-items:center;gap:7px;color:#83a8c7;font:11px ui-monospace,SFMono-Regular,Consolas,monospace}.quest-env-input{flex:1;min-width:0;background:#081522;border:1px solid #263c55;border-radius:7px;color:#9fc2dc;padding:5px 8px;font:inherit}.era-invocador .real-hero{background:linear-gradient(105deg,#08111d 0%,#12142a 48%,#382131 100%)!important}.era-invocador .workspace-badge{border-color:#7d5632!important;color:#ffc168!important;background:#23170d!important}.era-invocador .card-title,.era-invocador .modal-kicker{letter-spacing:.02em}.era-invocador .real-hero:after{content:'⚙ ᚱ ᚢ ᚾ ᛖ  //  ARTIFACT FORGE';position:absolute;right:24px;bottom:8px;font:10px ui-monospace,monospace;letter-spacing:.22em;color:rgba(255,184,86,.18);pointer-events:none}


/* v32.0 · Rango 12 · Guardián / QuestTest */
.era-guardian .real-hero{background:radial-gradient(circle at 78% 20%,rgba(112,214,255,.12),transparent 26%),linear-gradient(110deg,#071018 0%,#101b2b 48%,#202541 100%)!important}
.era-guardian .workspace-badge{border-color:#5688a8!important;color:#a9e4ff!important;background:#0b202d!important}
.era-guardian .real-hero:after{content:'🛡 TEST // EVIDENCE // REGRESSION';position:absolute;right:24px;bottom:8px;font:10px ui-monospace,monospace;letter-spacing:.22em;color:rgba(154,226,255,.18);pointer-events:none}
.run-tests{border-color:rgba(104,211,255,.38)!important;color:#9fe7ff!important;background:rgba(43,125,158,.08)!important}
.run-tests:hover{background:rgba(43,125,158,.16)!important}

/* v34 · QuestSave + catálogo completo de lecciones */
.questsave-state{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid rgba(255,255,255,.09);border-radius:999px;font:600 11px/1.1 "JetBrains Mono",monospace;color:#b9c7d8;background:rgba(7,13,24,.5);white-space:nowrap}.questsave-state.saved{color:#9ee6bb;border-color:rgba(86,210,137,.22)}.questsave-state.saving{color:#ffd38b;border-color:rgba(255,178,76,.3)}.questsave-state.dirty{color:#f6c776}.questsave-state.error{color:#ff9d9d;border-color:rgba(255,96,96,.3)}.questsave-state.review{color:#aebdff;border-color:rgba(123,139,255,.28)}.questsave-manual{padding:7px 10px!important;font-size:11px!important}.questsave-manual:disabled{opacity:.42;cursor:not-allowed}
.course-catalog-intro{display:flex;justify-content:space-between;gap:22px;align-items:flex-start;margin-bottom:22px;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:linear-gradient(135deg,rgba(255,178,76,.06),rgba(103,86,255,.05))}.course-catalog-intro h3{margin:8px 0 6px}.course-catalog-intro p{max-width:760px;margin:0;color:var(--muted)}.course-catalog-legend{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.course-catalog-legend span{font-size:11px;padding:6px 9px;border:1px solid rgba(255,255,255,.08);border-radius:999px;color:var(--muted)}
.course-range-group{margin:0 0 18px;border:1px solid rgba(255,255,255,.08);border-radius:18px;overflow:hidden;background:rgba(5,10,18,.38)}.course-range-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;background:rgba(255,255,255,.025);border-bottom:1px solid rgba(255,255,255,.07)}.course-range-head>div{display:flex;align-items:center;gap:10px}.course-range-head span{font:800 11px "JetBrains Mono",monospace;color:var(--warm)}.course-range-head strong{font-size:14px}.course-range-head small{color:var(--muted)}.course-lesson-list{display:grid}.course-lesson-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px 16px;border-bottom:1px solid rgba(255,255,255,.055)}.course-lesson-row:last-child{border-bottom:0}.course-lesson-row.done{background:rgba(65,185,118,.025)}.course-lesson-row.current{background:linear-gradient(90deg,rgba(255,178,76,.09),transparent)}.course-lesson-row.locked{opacity:.62}.course-lesson-index{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.05);font:700 12px "JetBrains Mono",monospace}.course-lesson-row.done .course-lesson-index{color:#83dba7}.course-lesson-row.current .course-lesson-index{color:var(--warm)}.course-lesson-copy{display:grid;gap:3px}.course-lesson-copy span{font:600 10px "JetBrains Mono",monospace;color:var(--muted);text-transform:uppercase}.course-lesson-copy strong{font-size:13px}.course-lesson-copy small{color:var(--muted);font-size:11px}.course-lesson-action .btn{min-width:126px;padding:8px 10px;font-size:11px}.exit-review-mode{margin:12px 0 2px}
@media(max-width:760px){.course-catalog-intro{display:block}.course-catalog-legend{justify-content:flex-start;margin-top:14px}.course-lesson-row{grid-template-columns:30px 1fr}.course-lesson-action{grid-column:2}.course-lesson-action .btn{width:100%}.editor-head-badges{flex-wrap:wrap}.questsave-state{order:-1}}

/* v35 · Era del Observador */
.era-observador .real-hero{background:radial-gradient(circle at 78% 28%,rgba(40,220,190,.13),transparent 28%),linear-gradient(110deg,#061521 0%,#0d2630 48%,#241b38 100%)!important}.era-observador .workspace-badge{border-color:#2f8f83!important;color:#7af2d9!important;background:#0a2827!important}.era-observador .card-title{letter-spacing:.025em}.era-observador .real-hero:after{content:'◉  OBSERVE // CORRELATE // EXPLAIN';position:absolute;right:24px;bottom:8px;font:10px ui-monospace,monospace;letter-spacing:.20em;color:rgba(103,239,217,.20);pointer-events:none}.era-observador .lesson-number{box-shadow:0 0 24px rgba(70,220,196,.10)}

/* v36 · Era del Centinela */
.era-centinela .real-hero{background:radial-gradient(circle at 78% 24%,rgba(255,108,69,.17),transparent 30%),radial-gradient(circle at 18% 80%,rgba(255,190,74,.09),transparent 34%),linear-gradient(110deg,#07131d 0%,#15192a 44%,#3a1d24 100%)!important}
.era-centinela .workspace-badge{border-color:#aa5d37!important;color:#ffc071!important;background:#2b1b18!important}.era-centinela .real-hero:after{content:'🛡  DETECT // CONTAIN // RECOVER';position:absolute;right:24px;bottom:8px;font:10px ui-monospace,monospace;letter-spacing:.16em;color:rgba(255,184,103,.23);pointer-events:none}
.resilience-chain{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:14px}.resilience-chain span{padding:6px 9px;border:1px solid #7d5138;border-radius:8px;background:#1d1718;color:#ffc277;font:800 10px ui-monospace,monospace;letter-spacing:.08em}.resilience-chain b{color:#a88875}
.sentinel-hud{margin:0 12px 10px;border:1px solid #6e4938;border-radius:12px;background:linear-gradient(110deg,#111923,#24191a);padding:10px 12px;box-shadow:inset 0 0 24px rgba(255,120,65,.04)}.sentinel-hud-head{display:flex;justify-content:space-between;gap:12px;color:#ffb567;font:800 11px ui-monospace,monospace;letter-spacing:.08em}.sentinel-hud-head span{color:#8ff0c8}.sentinel-hud-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:8px}.sentinel-hud-grid span{border:1px solid #2e4351;border-radius:8px;padding:7px 8px;color:#9fb3c8;font-size:11px}.sentinel-hud-grid b{display:block;color:#f4f7fa;margin-top:3px;font-family:ui-monospace,monospace}@media(max-width:900px){.sentinel-hud-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v37.0 · Retos de Autonomía ------------------------------------------------ */
.autonomy-backdrop{position:fixed;inset:0;z-index:1200;background:rgba(3,7,18,.82);backdrop-filter:blur(10px);padding:28px;overflow:auto}.autonomy-backdrop[hidden]{display:none}.autonomy-modal{max-width:1500px;margin:0 auto}.autonomy-shell{background:linear-gradient(180deg,#0d1425 0%,#0a1020 100%);border:1px solid rgba(166,180,220,.18);border-radius:26px;box-shadow:0 30px 100px rgba(0,0,0,.55);padding:26px;color:#eef3ff}.autonomy-top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.autonomy-top h2{font-size:clamp(28px,4vw,46px);margin:8px 0 6px}.autonomy-top p{max-width:850px;color:#aeb9d6;line-height:1.65}.autonomy-close{border:0;background:#17223d;color:#fff;border-radius:14px;width:44px;height:44px;font-size:26px;cursor:pointer}.autonomy-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:22px 0}.autonomy-summary>div{padding:18px;border:1px solid rgba(136,153,205,.17);border-radius:18px;background:#111a30}.autonomy-summary strong{display:block;font-size:28px;color:#ffd36b}.autonomy-summary small{color:#8997ba}.autonomy-philosophy{display:grid;gap:5px;padding:18px 20px;border-radius:18px;background:linear-gradient(90deg,rgba(121,82,255,.13),rgba(255,174,66,.08));border:1px solid rgba(159,120,255,.22)}.autonomy-philosophy b{color:#d6c6ff}.autonomy-philosophy span{font-weight:800}.autonomy-philosophy small{color:#9ca9c9}.autonomy-range-tabs{display:flex;gap:8px;overflow:auto;padding:18px 0 12px;position:sticky;top:-28px;z-index:3;background:linear-gradient(#0c1324 75%,transparent)}.autonomy-range-tabs button{white-space:nowrap;border:1px solid #263454;background:#121c33;color:#dbe5ff;padding:10px 13px;border-radius:999px;cursor:pointer}.autonomy-range-tabs button small{opacity:.65;margin-left:4px}.autonomy-range-tabs button.locked{opacity:.42;cursor:not-allowed}.autonomy-range-group{margin:20px 0 34px;padding-top:8px;scroll-margin-top:70px}.autonomy-range-group.locked{opacity:.48}.autonomy-range-head{display:grid;grid-template-columns:1.1fr 1fr;gap:18px;align-items:start;margin-bottom:14px}.autonomy-range-head>div:first-child{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center}.autonomy-range-head>div:first-child>span{grid-row:1/3;background:#ffad42;color:#16100a;font-weight:900;padding:8px 10px;border-radius:12px}.autonomy-range-head h3{margin:0;font-size:25px}.autonomy-range-head p{grid-column:2;color:#8f9cbc;margin:2px 0}.autonomy-growth{background:#101a2e;border:1px solid #223050;border-radius:16px;padding:14px 18px}.autonomy-growth b{color:#7ee2b8}.autonomy-growth ul{margin:8px 0 0;padding-left:18px;color:#bac6e3;columns:2}.autonomy-card-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.autonomy-card{display:flex;flex-direction:column;gap:10px;min-height:260px;padding:16px;border:1px solid #202d4a;border-radius:18px;background:linear-gradient(180deg,#111a30,#0d1527)}.autonomy-card.done{border-color:rgba(90,218,169,.35);box-shadow:inset 0 0 0 1px rgba(90,218,169,.08)}.autonomy-card-icon{font-size:28px}.autonomy-card-copy{display:flex;flex-direction:column;gap:7px;flex:1}.autonomy-card-copy>span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#8ea0c6}.autonomy-card-copy>strong{font-size:17px}.autonomy-card-copy p{font-size:13px;line-height:1.5;color:#aab6d4;margin:0}.autonomy-card-copy small{margin-top:auto;color:#e3b968}.autonomy-card .btn{width:100%}
.autonomy-challenge-head{display:grid;grid-template-columns:1.4fr .8fr;gap:20px;margin:22px 0}.autonomy-challenge-head h2{font-size:36px;margin:10px 0}.autonomy-challenge-head p{font-size:16px;line-height:1.65;color:#afbad4}.autonomy-challenge-head aside{background:#10192d;border:1px solid #263653;border-radius:18px;padding:18px}.autonomy-challenge-head aside>b{font-size:11px;letter-spacing:.12em;color:#ffca69}.autonomy-challenge-head aside ul{padding-left:18px;color:#c6d1ea;line-height:1.55}.autonomy-challenge-head aside small{color:#7f8dac}.autonomy-workflow{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:16px}.autonomy-workflow span{padding:9px;text-align:center;font-size:11px;font-weight:900;color:#7784a4;border-bottom:2px solid #202d49}.autonomy-workflow span.active{color:#ffcc71;border-color:#ffad42}.questplan-panel{background:#0e1729;border:1px solid #263651;border-radius:20px;padding:20px;margin-bottom:16px}.questplan-head{display:flex;justify-content:space-between;gap:20px}.questplan-head span{color:#d5c2ff;font-size:12px;font-weight:900;letter-spacing:.12em}.questplan-head h3{margin:4px 0}.questplan-head p{margin:0 0 14px;color:#8e9dbd;max-width:850px}.questplan-field{display:block;margin:12px 0}.questplan-field>span{display:block;font-size:12px;font-weight:800;color:#c7d2ed;margin-bottom:6px}.questplan-field textarea,.autonomy-reflection textarea{width:100%;min-height:68px;resize:vertical;border:1px solid #263756;background:#09111f;color:#eff5ff;border-radius:12px;padding:12px;outline:none}.questplan-field textarea:focus,.autonomy-reflection textarea:focus{border-color:#8f70ff;box-shadow:0 0 0 3px rgba(143,112,255,.1)}.questplan-field.prediction{border-top:1px dashed #2c3b5d;padding-top:14px}.questplan-field.prediction>span{color:#c9abff}.hint-output{margin-top:12px;padding:12px 14px;background:#161d31;border-radius:12px;color:#f2d593}.questplan-actions{display:flex;justify-content:flex-end}.autonomy-lab{position:relative;border:1px solid #243452;border-radius:20px;overflow:hidden;background:#08101d}.autonomy-lab.locked{min-height:180px}.autonomy-lab-lock{display:flex;position:absolute;inset:0;z-index:2;align-items:center;justify-content:center;flex-direction:column;background:rgba(8,16,29,.92);text-align:center}.autonomy-lab-lock strong{font-size:22px}.autonomy-lab-lock p{color:#8e9cbc}.autonomy-lab-inner{display:grid;grid-template-columns:1.35fr .8fr;min-height:620px}.autonomy-lab-inner[inert]{pointer-events:none;opacity:.3}.autonomy-editor{border-right:1px solid #1d2a44}.autonomy-filebar{height:54px;display:flex;align-items:center;gap:8px;padding:8px 10px;background:#0e1728;border-bottom:1px solid #1e2c48}.autonomy-tabs{display:flex;gap:5px;overflow:auto;flex:1}.autonomy-tabs button{border:0;background:#141f35;color:#8999bd;border-radius:9px;padding:8px 10px;white-space:nowrap;cursor:pointer}.autonomy-tabs button.active{background:#263657;color:#fff}.autonomy-code-wrap{height:500px}.autonomy-code{width:100%;height:100%;resize:none;border:0;outline:0;background:#07101d;color:#dce9ff;padding:18px;font:14px/1.65 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;tab-size:4}.autonomy-code.read-only-file{opacity:.68}.autonomy-actions{display:flex;gap:8px;padding:12px;background:#0d1627}.autonomy-console{padding:16px;display:flex;flex-direction:column;gap:12px;background:#0a1220}.autonomy-console>div:first-child{display:flex;justify-content:space-between;color:#8da0c8;font-size:12px}.autonomy-console pre{white-space:pre-wrap;overflow:auto;min-height:180px;max-height:280px;background:#050b14;border:1px solid #17243d;border-radius:12px;padding:13px;color:#a9f2c9}.prediction-compare{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;background:#111a2e;border:1px solid #263552;border-radius:12px}.prediction-compare>b{grid-column:1/-1;color:#c9b4ff;font-size:11px}.prediction-compare span{font-size:10px;color:#8090b3;text-transform:uppercase}.prediction-compare p{margin:4px 0;color:#dce6fa;font-size:12px}.autonomy-reflection span{display:block;color:#b7c3df;font-size:12px;margin-bottom:6px}.autonomy-feedback{padding:13px;border-radius:12px;background:#111c30;border:1px solid #2c3d5f}.autonomy-feedback strong{color:#7ce0b7}.autonomy-coach{margin-top:9px;padding:10px;background:#16182a;border-left:3px solid #a98cff;color:#ddd5ff}.autonomy-save-state{color:#88dfba;font-size:12px;align-self:center}
@media(max-width:1200px){.autonomy-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.autonomy-lab-inner{grid-template-columns:1fr}.autonomy-editor{border-right:0;border-bottom:1px solid #1d2a44}.autonomy-range-head{grid-template-columns:1fr}}
@media(max-width:760px){.autonomy-backdrop{padding:0}.autonomy-shell{border-radius:0;padding:16px;min-height:100vh}.autonomy-summary{grid-template-columns:1fr 1fr}.autonomy-card-grid{grid-template-columns:1fr}.autonomy-challenge-head{grid-template-columns:1fr}.autonomy-workflow{overflow:auto;grid-template-columns:repeat(5,130px)}.autonomy-growth ul{columns:1}.autonomy-lab-inner{min-height:540px}.autonomy-code-wrap{height:360px}.questplan-head{flex-direction:column}.autonomy-top{align-items:center}}
.range-growth-proof{display:grid;grid-template-columns:1fr 1.4fr;gap:12px;margin-top:16px}.range-growth-proof>div{padding:15px 16px;border-radius:15px;background:#10192c;border:1px solid #22304e}.range-growth-proof span{font-size:10px;font-weight:900;letter-spacing:.12em;color:#ffbf63}.range-growth-proof p{margin:7px 0 0;color:#a8b4d0;line-height:1.45}.range-growth-proof ul{margin:7px 0 0;padding:0;list-style:none;columns:2;color:#bfe9d3}.range-growth-proof li{margin:3px 0}@media(max-width:760px){.range-growth-proof{grid-template-columns:1fr}.range-growth-proof ul{columns:1}}

/* CQ 40.1 - ROOT direct preview fallback (server rendered; no JS dependency) */
.root-direct-preview{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0 14px;padding:10px 12px;border:1px solid rgba(139,108,255,.34);border-radius:12px;background:linear-gradient(135deg,rgba(20,31,49,.95),rgba(39,28,62,.88));font-size:10px}.root-direct-preview>span{font-weight:900;color:#cbbcff;letter-spacing:.8px;margin-right:4px}.root-direct-preview a{padding:7px 10px;border-radius:9px;border:1px solid #334a68;background:#0b1828;color:#d8e3f0;text-decoration:none;font-weight:800}.root-direct-preview a:hover{border-color:#8b6cff;color:#fff}.root-direct-preview .root-final{border-color:rgba(245,166,91,.65);color:#ffd49a;background:rgba(96,55,23,.28)}.root-direct-preview .root-reset{margin-left:auto;color:#9fb0c4}

/* CQ40.4-final · cierre falso R17 / contrato de continuidad */
.continuity-card{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:0;padding:0;overflow:hidden;border:1px solid rgba(236,72,153,.42);background:linear-gradient(135deg,rgba(17,24,39,.98),rgba(30,27,75,.95) 58%,rgba(76,29,149,.72));box-shadow:0 22px 60px rgba(2,6,23,.34),inset 0 1px 0 rgba(255,255,255,.03)}
.continuity-main{padding:26px 30px 28px;position:relative;overflow:hidden}.continuity-main:after{content:"17";position:absolute;right:12px;bottom:-42px;font-size:180px;font-weight:1000;line-height:1;color:rgba(168,85,247,.055);pointer-events:none}.continuity-eyebrow{display:flex;align-items:center;gap:8px;color:#ff6aa9;font-size:12px;font-weight:900;letter-spacing:.12em}.continuity-head{display:flex;align-items:center;gap:18px;margin:16px 0 18px}.continuity-rank{width:64px;height:64px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(145deg,#7c3aed,#a855f7);box-shadow:0 12px 30px rgba(124,58,237,.35);font-size:28px;font-weight:1000}.continuity-head small{color:#c4b5fd;font-weight:900;letter-spacing:.06em}.continuity-head h2{margin:3px 0 4px;font-size:28px}.continuity-head p{margin:0;color:#cbd5e1}.continuity-brief{max-width:760px;padding:16px 18px;border:1px solid rgba(148,163,184,.18);border-radius:16px;background:rgba(15,23,42,.52)}.continuity-brief>div{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:8px}.continuity-brief span{font-size:10px;color:#ff6aa9;font-weight:900;letter-spacing:.1em}.continuity-brief strong{font-size:15px}.continuity-brief p{margin:0;color:#cbd5e1;line-height:1.55}.continuity-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.continuity-tags span{padding:7px 10px;border:1px solid rgba(196,181,253,.2);border-radius:999px;background:rgba(15,23,42,.45);font-size:11px;color:#ddd6fe}
.continuity-contract{padding:24px;border-left:1px solid rgba(236,72,153,.2);background:linear-gradient(180deg,rgba(15,23,42,.75),rgba(15,23,42,.94));display:flex;flex-direction:column;justify-content:center}.contract-icon{font-size:34px;margin-bottom:7px}.continuity-contract h3{margin:6px 0 10px;font-size:20px}.continuity-contract .graduation-name{margin:12px 0}.continuity-contract .graduation-name input{background:rgba(2,6,23,.48);border-color:rgba(148,163,184,.24)}.continuity-contract .graduation-check{padding:11px 12px;border:1px solid rgba(245,158,11,.2);border-radius:12px;background:rgba(245,158,11,.055);font-size:12px;line-height:1.45}.continuity-fineprint{display:block;margin-top:10px;color:#94a3b8;line-height:1.4}.continuity-lesson-card .lesson-number{background:linear-gradient(145deg,#7c3aed,#a855f7);color:#fff}.continuity-editor-lock .protocol-lock-copy span{color:#ff6aa9}
.final-reveal{display:grid;grid-template-columns:110px 1fr;gap:24px;border:1px solid rgba(245,158,11,.45);background:radial-gradient(circle at 10% 0%,rgba(245,158,11,.12),transparent 35%),linear-gradient(135deg,rgba(15,23,42,.98),rgba(30,27,75,.96));padding:26px}.final-reveal-mark{width:92px;height:92px;display:grid;place-items:center;border:1px solid rgba(245,158,11,.4);border-radius:24px;background:rgba(245,158,11,.08);font:900 20px/1 monospace;color:#fbbf24;box-shadow:inset 0 0 28px rgba(245,158,11,.07)}.final-reveal-glitch{font:900 13px/1 monospace;letter-spacing:.12em;color:#f472b6}.final-reveal-copy>h2{font-size:30px;margin:7px 0}.final-reveal-copy>p{color:#cbd5e1}.final-reveal-line{font-size:16px;max-width:880px}.final-reveal-divider{height:1px;margin:22px 0;background:linear-gradient(90deg,rgba(245,158,11,.6),rgba(168,85,247,.35),transparent)}.final-reveal .cq-final-certificate{margin:0;background:rgba(2,6,23,.22);border-color:rgba(245,158,11,.28);box-shadow:none}
@media(max-width:980px){.continuity-card{grid-template-columns:1fr}.continuity-contract{border-left:0;border-top:1px solid rgba(236,72,153,.2)}.final-reveal{grid-template-columns:1fr}.final-reveal-mark{width:70px;height:70px}}


/* CQ40.4-final2 · Final de campaña en lienzo completo
   Conserva solamente el sidebar. Rango 17/carta/reveal ocupan toda el área principal. */
@media (min-width:901px){
  body.cq-final-screen .main{
    height:100dvh!important;
    display:block!important;
    overflow:hidden!important;
  }
  body.cq-final-screen .topbar,
  body.cq-final-screen .footer{
    display:none!important;
  }
  body.cq-final-screen .dashboard-grid.clean-dashboard{
    display:block!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    padding:16px!important;
    margin:0!important;
    overflow:auto!important;
  }
  body.cq-final-screen .dashboard-grid.clean-dashboard > .slot:not(#slot-graduation){
    display:none!important;
  }
  body.cq-final-screen #slot-graduation{
    display:block!important;
    width:100%!important;
    height:calc(100dvh - 32px)!important;
    min-height:calc(100dvh - 32px)!important;
    margin:0!important;
    overflow:visible!important;
  }
  body.cq-final-screen #slot-graduation > .continuity-card,
  body.cq-final-screen #slot-graduation > .final-reveal,
  body.cq-final-screen #slot-graduation > .cq-final-certificate{
    width:100%!important;
    min-height:100%!important;
    height:auto!important;
    margin:0!important;
    border-radius:22px!important;
  }
  body.cq-final-screen .continuity-card{
    grid-template-columns:minmax(0,1.45fr) minmax(360px,.62fr)!important;
    align-items:stretch!important;
  }
  body.cq-final-screen .continuity-main{
    padding:clamp(34px,4vw,68px)!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
  }
  body.cq-final-screen .continuity-main:after{
    font-size:min(31vw,430px)!important;
    right:2vw!important;
    bottom:-9vw!important;
  }
  body.cq-final-screen .continuity-eyebrow{font-size:13px!important}
  body.cq-final-screen .continuity-head{margin:24px 0 28px!important;gap:24px!important}
  body.cq-final-screen .continuity-rank{width:84px!important;height:84px!important;border-radius:24px!important;font-size:38px!important}
  body.cq-final-screen .continuity-head h2{font-size:clamp(32px,3vw,52px)!important;margin:5px 0 8px!important}
  body.cq-final-screen .continuity-head p{font-size:15px!important;max-width:720px!important}
  body.cq-final-screen .continuity-brief{max-width:920px!important;padding:22px 24px!important}
  body.cq-final-screen .continuity-brief strong{font-size:20px!important}
  body.cq-final-screen .continuity-brief p{font-size:14px!important}
  body.cq-final-screen .continuity-tags span{font-size:12px!important;padding:9px 13px!important}
  body.cq-final-screen .continuity-contract{
    padding:clamp(28px,3vw,52px)!important;
  }
  body.cq-final-screen .contract-icon{font-size:50px!important}
  body.cq-final-screen .continuity-contract h3{font-size:26px!important}
  body.cq-final-screen .continuity-contract .graduation-name,
  body.cq-final-screen .continuity-contract .graduation-check{font-size:13px!important}
  body.cq-final-screen .continuity-contract .graduation-name input{padding:14px 15px!important;font-size:14px!important}
  body.cq-final-screen .continuity-contract .btn{padding:13px 16px!important;font-size:12px!important}

  body.cq-final-screen .final-reveal{
    grid-template-columns:128px minmax(0,1fr)!important;
    padding:clamp(30px,3vw,54px)!important;
    align-content:center!important;
    overflow:auto!important;
  }
  body.cq-final-screen .final-reveal-mark{
    width:110px!important;height:110px!important;border-radius:28px!important;font-size:24px!important;
  }
  body.cq-final-screen .final-reveal-copy>h2{font-size:clamp(36px,3.2vw,56px)!important}
  body.cq-final-screen .final-reveal-copy>p{font-size:16px!important}
  body.cq-final-screen .final-reveal .cq-final-certificate{
    padding:24px!important;
    grid-template-columns:72px minmax(0,1fr)!important;
  }
}

@media (max-width:900px){
  body.cq-final-screen .mobile-appbar,
  body.cq-final-screen .mobile-searchbar,
  body.cq-final-screen .mobile-bottom-nav,
  body.cq-final-screen .topbar,
  body.cq-final-screen .footer{display:none!important}
  body.cq-final-screen .dashboard-grid.clean-dashboard{
    position:fixed!important;
    inset:0!important;
    height:100dvh!important;
    padding:10px!important;
    overflow:auto!important;
  }
  body.cq-final-screen .dashboard-grid.clean-dashboard > .slot:not(#slot-graduation){display:none!important}
  body.cq-final-screen #slot-graduation{display:block!important;width:100%!important;margin:0!important}
  body.cq-final-screen .continuity-card{grid-template-columns:1fr!important}
}


/* CQ autonomy progression gates */
.autonomy-gate{margin:18px 0 0;padding:16px 18px;border:1px solid #3a4f6d;border-radius:14px;background:linear-gradient(145deg,rgba(14,27,46,.96),rgba(20,24,48,.96));display:grid;gap:7px}.autonomy-gate span{font-size:9px;font-weight:900;letter-spacing:1.1px;color:#ffb958}.autonomy-gate strong{font-size:17px;color:#f6eadb}.autonomy-gate p{margin:0;color:#aebdd0;font-size:10px;line-height:1.5}.autonomy-gate.locked{border-color:#8a4b61;box-shadow:inset 3px 0 0 #ff5d8f}.autonomy-gate.ready{border-color:#2f7659;box-shadow:inset 3px 0 0 #45d58b}.autonomy-gate .btn{justify-self:start;margin-top:4px}.contract-check.gate-disabled{opacity:.5;cursor:not-allowed}

/* CQ40.4 autonomy lab activation fix: author CSS must honor hidden explicitly. */
.autonomy-lab-lock[hidden]{display:none !important}

/* QuestContract · evidencia funcional de retos abiertos */
.quest-contract-report{margin:12px 0;padding:12px 14px;border:1px solid #334a69;border-radius:13px;background:rgba(6,17,31,.58)}
.quest-contract-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:9px;color:#dbe9ff;font-size:11px;letter-spacing:.7px}.quest-contract-head b{color:#ffb457}.quest-contract-head span{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#8da9c8}.quest-contract-report ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}.quest-contract-report li{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(0,1.4fr);gap:9px;padding:7px 9px;border-radius:9px;font-size:10px;background:rgba(13,27,44,.72)}.quest-contract-report li.ok{box-shadow:inset 3px 0 0 #42d68a}.quest-contract-report li.bad{box-shadow:inset 3px 0 0 #ff5d7d}.quest-contract-report li b{color:#eef5ff}.quest-contract-report li span{color:#9fb0c5}
@media(max-width:760px){.quest-contract-report li{grid-template-columns:1fr}}


/* Phase 4 · Field Contracts + restored logout action */
.field-contract-banner{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;margin:14px 0 18px;padding:16px 18px;border:1px solid rgba(72,211,145,.28);border-radius:15px;background:radial-gradient(circle at 85% 20%,rgba(67,211,151,.12),transparent 34%),linear-gradient(145deg,#0d1d2d,#121b31);box-shadow:0 14px 34px rgba(0,0,0,.18)}
.field-contract-banner span,.field-contract-brief span{display:block;color:#71dca7;font-size:9px;font-weight:900;letter-spacing:1.2px}.field-contract-banner strong{display:block;margin:5px 0;font-size:14px}.field-contract-banner p,.field-contract-brief p{margin:0;color:#95a8bc;font-size:10px;line-height:1.5}.field-contract-reward{text-align:right;min-width:150px}.field-contract-reward small{display:block;color:#7f91a7;font-size:8px}.field-contract-reward b{display:block;margin:3px 0 8px;color:#8af0bb;font-size:21px}.field-contract-brief{margin:0 0 12px;padding:13px 15px;border:1px solid rgba(72,211,145,.24);border-radius:12px;background:rgba(36,133,94,.08)}.field-contract-brief strong{display:block;margin:5px 0;color:#e8fff3;font-size:12px}
.sidebar .logout-form .logout-link,.mobile-drawer-bottom .logout-form .logout-link{display:flex!important;align-items:center;gap:9px;width:100%;min-height:38px;padding:9px 11px!important;border:1px solid rgba(255,111,126,.14)!important;border-radius:11px;background:linear-gradient(135deg,rgba(101,36,53,.14),rgba(18,28,43,.8))!important;color:#aebccd!important;font-size:10px!important;font-weight:750!important;letter-spacing:.15px;text-align:left;transition:.18s ease}.sidebar .logout-form .logout-link::before,.mobile-drawer-bottom .logout-form .logout-link::before{content:'↪';width:22px;height:22px;display:grid;place-items:center;border-radius:7px;background:rgba(255,105,124,.1);color:#ff8799;font-size:13px}.sidebar .logout-form .logout-link:hover,.mobile-drawer-bottom .logout-form .logout-link:hover{color:#fff!important;border-color:rgba(255,111,126,.3)!important;background:linear-gradient(135deg,rgba(117,39,58,.28),rgba(29,31,49,.96))!important;transform:translateX(2px)}
@media(max-width:700px){.field-contract-banner{grid-template-columns:1fr}.field-contract-reward{text-align:left}.field-contract-reward .btn{width:100%}}

.autonomy-runtime-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:9px 10px;border-bottom:1px solid #263c56;background:#0a1727}.autonomy-runtime-controls label span{display:block;margin-bottom:4px;color:#8195ad;font-size:8px;font-weight:800;letter-spacing:.5px}.autonomy-runtime-controls input{width:100%;height:34px;border:1px solid #304966;border-radius:8px;background:#071321;color:#dce8f5;padding:0 9px;font:10px "JetBrains Mono",monospace;outline:0}.autonomy-runtime-controls input:focus{border-color:#8d6cf3;box-shadow:0 0 0 2px rgba(141,108,243,.1)}@media(max-width:700px){.autonomy-runtime-controls{grid-template-columns:1fr}}

/* Fase 5 · frontera final de autonomía */
.autonomy-final-frontier{margin:16px 0;padding:16px 18px;border:1px solid rgba(177,114,255,.34);border-radius:16px;background:linear-gradient(135deg,rgba(125,70,220,.13),rgba(255,169,76,.07));display:grid;gap:5px}
.autonomy-final-frontier span{font-size:.72rem;letter-spacing:.16em;font-weight:800;color:#c9a6ff}
.autonomy-final-frontier strong{font-size:1rem;color:var(--text,#f4f1ff)}
.autonomy-final-frontier p{margin:0;color:var(--muted,#a8a2bb);line-height:1.55}

/* QuestGuide XP support dock */
.search{transition:width .2s ease,border-color .2s ease,background .2s ease}
.search.quest-support-mode{width:min(690px,58vw);padding:5px 7px;border-color:rgba(255,177,79,.42);background:linear-gradient(135deg,#101a2a,#17182b);box-shadow:0 8px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.03)}
.search.quest-support-mode>span,.search.quest-support-mode>input,.search.quest-support-mode>kbd{display:none}
.quest-support-dock{width:100%;min-width:0;display:flex;align-items:center;gap:8px}
.quest-support-xp{display:flex;align-items:baseline;gap:6px;white-space:nowrap;padding:0 8px;border-right:1px solid var(--line-soft)}
.quest-support-xp small{font-size:8px;color:#8f9db1;text-transform:uppercase;letter-spacing:.7px}
.quest-support-xp strong{font-size:13px;color:#ffc15d}
.quest-support-actions{display:flex;gap:5px;flex:1;min-width:0}
.quest-support-tier{flex:1;min-width:0;height:31px;border:1px solid #344761;background:#17243a;color:#eef3f9;border-radius:8px;padding:3px 7px;display:flex;align-items:center;justify-content:space-between;gap:5px;font-size:9px;font-weight:800;cursor:pointer;transition:.16s ease}
.quest-support-tier:hover{transform:translateY(-1px);border-color:#d49759;background:#202a3f}
.quest-support-tier span{overflow:hidden;text-overflow:ellipsis}
.quest-support-tier b{font-size:8px;color:#ffbd61;white-space:nowrap}
.quest-support-tier.unlocked{border-color:rgba(70,201,139,.35);background:rgba(31,92,72,.24)}
.quest-support-tier.unlocked b{color:#6fdba4}
.quest-support-tier:disabled{opacity:.55;cursor:wait;transform:none}
.quest-support-close{width:27px;height:27px;flex:0 0 27px;border:1px solid #344761;background:#131e30;color:#91a0b4;border-radius:8px;font-size:17px;line-height:1;cursor:pointer}
.quest-support-close:hover{color:#fff;border-color:#596b84}
.quest-support-loading,.quest-support-error{font-size:10px;color:#c9d2df;padding:0 8px;flex:1}
@media(max-width:900px){.search.quest-support-mode{width:100%}.quest-support-xp small{display:none}.quest-support-tier{padding:3px 5px}.quest-support-tier b{font-size:7px}}


/* QuestGuide XP wallet + responsive support modal · v40.4-tipxp2 */
@media (min-width:901px){
  .topbar .search.cq-search-compact{flex:0 1 390px!important;width:min(390px,30vw)!important;max-width:390px!important;min-width:220px!important}
  .cq-xp-strip{height:42px;display:flex;align-items:center;gap:10px;padding:0 12px;border:1px solid #31445f;border-radius:12px;background:linear-gradient(180deg,#0d1a2b,#0a1625);box-shadow:inset 0 1px 0 rgba(255,255,255,.025);white-space:nowrap}
  .cq-xp-strip>div{display:grid;line-height:1.05;gap:3px}.cq-xp-strip small{font-size:7px;letter-spacing:.8px;color:#7f91a8;font-weight:900}.cq-xp-strip strong{font-size:11px;color:#d9e3ef;font-variant-numeric:tabular-nums}.cq-xp-strip .available strong{color:#ffc15d}.cq-xp-strip i{height:22px;width:1px;background:#24364e}
}
@media(max-width:900px){.cq-xp-strip{display:none!important}}

.cq-support-backdrop{z-index:260!important;display:grid!important;place-items:center!important;padding:18px;background:rgba(3,9,17,.78);backdrop-filter:blur(10px)}
.cq-support-modal{position:relative;width:min(860px,96vw);max-height:min(820px,92dvh);overflow:auto;padding:28px;border:1px solid #3a4f6d;border-radius:22px;background:radial-gradient(circle at 85% 0,rgba(115,72,210,.17),transparent 35%),radial-gradient(circle at 0 100%,rgba(255,173,75,.11),transparent 34%),linear-gradient(180deg,#0d1b2d,#091523);box-shadow:0 34px 100px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.04);color:#eef3f8}
.cq-support-modal header{padding-right:38px}.cq-support-modal h2{margin:5px 0 7px;font-size:28px;letter-spacing:-.5px}.cq-support-modal header p{margin:0;color:#9cabc0;font-size:13px;line-height:1.55}.cq-support-x{position:absolute;right:16px;top:16px;width:36px;height:36px;border:1px solid #344a67;border-radius:11px;background:#101f32;color:#95a5b9;font-size:22px;cursor:pointer}.cq-support-x:hover{color:#fff;border-color:#647895}
.cq-support-wallet{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0 16px}.cq-support-wallet>div{padding:13px 15px;border:1px solid #2d425e;border-radius:13px;background:rgba(10,27,45,.75)}.cq-support-wallet small{display:block;font-size:8px;letter-spacing:.9px;color:#7f91a8;text-transform:uppercase;font-weight:900}.cq-support-wallet strong{display:block;margin-top:5px;font-size:20px;font-variant-numeric:tabular-nums}.cq-support-wallet .available{border-color:rgba(255,184,91,.38);background:rgba(88,58,22,.16)}.cq-support-wallet .available strong{color:#ffc15d}
.cq-support-tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cq-support-card{min-height:205px;text-align:left;display:flex;flex-direction:column;border:1px solid #324760;border-radius:16px;padding:17px;background:linear-gradient(180deg,#122238,#0e1c2e);color:#edf3f9;cursor:pointer;transition:.18s ease}.cq-support-card:hover{transform:translateY(-3px);border-color:#c98a52;box-shadow:0 14px 34px rgba(0,0,0,.22)}.cq-support-card:disabled{opacity:.55;cursor:wait;transform:none}.cq-support-card .tier-tag{align-self:flex-start;padding:4px 8px;border:1px solid rgba(255,190,91,.3);border-radius:999px;background:rgba(255,176,72,.07);font-size:8px;letter-spacing:.9px;color:#ffbd67;font-weight:900}.cq-support-card>strong{margin-top:13px;font-size:18px}.cq-support-card>p{margin:8px 0 18px;color:#9cabc0;font-size:12px;line-height:1.55}.cq-support-card footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #253a53;padding-top:12px}.cq-support-card footer span{font-size:11px;font-weight:900;color:#ffbe65}.cq-support-card footer b{font-size:9px;letter-spacing:.7px;color:#e9eff7}.cq-support-card.unlocked{border-color:rgba(72,209,145,.35);background:linear-gradient(180deg,rgba(18,55,48,.72),#0d1d27)}.cq-support-card.unlocked .tier-tag,.cq-support-card.unlocked footer span{color:#70dca5;border-color:rgba(72,209,145,.28)}.cq-support-rule{text-align:center;margin:16px 0 0;color:#788ba2;font-size:10px}
@media(max-width:700px){.cq-support-backdrop{padding:0;align-items:end!important}.cq-support-modal{width:100%;max-height:88dvh;border-radius:22px 22px 0 0;padding:20px 14px calc(20px + env(safe-area-inset-bottom));border-left:0;border-right:0;border-bottom:0}.cq-support-modal h2{font-size:23px}.cq-support-wallet{grid-template-columns:repeat(3,1fr);gap:6px;margin:15px 0 12px}.cq-support-wallet>div{padding:10px 8px}.cq-support-wallet strong{font-size:15px}.cq-support-wallet small{font-size:6.5px}.cq-support-tier-grid{grid-template-columns:1fr;gap:8px}.cq-support-card{min-height:0;padding:13px}.cq-support-card>strong{font-size:16px;margin-top:8px}.cq-support-card>p{font-size:11px;margin:6px 0 10px}.cq-support-card footer{padding-top:8px}.cq-support-rule{font-size:9px}}

/* Fase 6 · hardening topbar: no reservar huecos al mostrar wallet XP */
@media (min-width:901px){
  .topbar{width:100%;justify-content:flex-start}
  .topbar .search.cq-search-compact{
    flex:1 1 320px!important;
    width:auto!important;
    max-width:none!important;
    min-width:220px!important;
  }
  .topbar .cq-xp-strip{flex:0 0 auto;min-width:max-content}
  .topbar .top-stats,.topbar .cq-build-badge,.topbar .admin-root-badge,.topbar .profile-chip{flex-shrink:0}
}



/* === PySky official identity · SkyOfLies 2026 === */
.pysky-brand-with-logo{display:flex!important;align-items:center!important;gap:9px!important}
.pysky-brand-with-logo>img{width:36px;height:36px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(64,205,255,.34));flex:0 0 auto}
.mobile-brand.pysky-brand-with-logo>img{width:30px;height:30px}
.pysky-login-logo{position:absolute;top:56px;left:calc(23.6% - 88px);width:74px;height:74px;object-fit:contain;z-index:6;filter:drop-shadow(0 0 24px rgba(54,196,255,.35))}
.auth-panel{display:flex;flex-direction:column;align-items:center;justify-content:center}
.auth-skyoflies-link{margin-top:14px;color:#79dfff;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.03em}
.auth-skyoflies-link:hover{color:#fff}
.auth-product-line{margin-top:10px;color:#73869d;font-size:10px;letter-spacing:.05em;text-align:center}
.pysky-top-actions{display:flex;align-items:center;gap:10px;min-width:360px}
.pysky-about-btn,.pysky-home-btn{height:48px;border:1px solid #2d4663;border-radius:13px;background:linear-gradient(180deg,#0d1d30,#091625);color:#dfeeff;display:flex;align-items:center;gap:10px;padding:0 14px;text-decoration:none;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.pysky-about-btn{flex:1;text-align:left}.pysky-about-btn>span{font-size:20px;color:#65dcff}.pysky-about-btn b{font-size:12px}.pysky-about-btn small{font-size:8px;color:#7f94aa;margin-left:auto}
.pysky-home-btn{color:#ffc36b}.pysky-home-btn span{font-size:18px}.pysky-home-btn b{font-size:11px}
.pysky-about-btn:hover,.pysky-home-btn:hover{border-color:#5d7ea3;transform:translateY(-1px)}
.pysky-about-backdrop{z-index:1900!important;background:rgba(3,8,18,.86)!important;backdrop-filter:blur(12px)}
.pysky-about-modal{width:min(860px,94vw)!important;max-width:860px!important;padding:30px!important;text-align:left;background:radial-gradient(circle at 85% 0,rgba(74,88,223,.18),transparent 33%),radial-gradient(circle at 0 100%,rgba(255,172,70,.10),transparent 32%),linear-gradient(180deg,#0e1b2d,#081421)!important;border-color:#365370!important}
.pysky-about-logo{width:90px;height:90px;object-fit:contain;float:right;margin:-4px 26px 8px 24px;filter:drop-shadow(0 0 24px rgba(68,202,255,.35))}
.pysky-about-modal h2{font-size:30px;margin:7px 0 10px;letter-spacing:-.04em}.pysky-about-lead{color:#aebdd0;line-height:1.65;max-width:650px}
.pysky-about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;clear:both;margin-top:24px}.pysky-about-grid article{padding:16px;border:1px solid #243b57;border-radius:16px;background:#0a1828}.pysky-about-grid article>span{color:#ffb34d;font:800 10px var(--mono);letter-spacing:.13em}.pysky-about-grid b{display:block;margin:8px 0;font-size:15px}.pysky-about-grid p{margin:0;color:#91a5bb;font-size:12px;line-height:1.55}.pysky-about-actions{display:flex;gap:10px;margin-top:20px}.pysky-product-signature{display:block;margin-top:16px;color:#63788f;font-size:9px;letter-spacing:.07em}
/* Official logo seal on PySky modals without changing module behavior */
.cq-modal:not(.pysky-about-modal),.cq-input-modal,.cq-support-modal,.autonomy-shell{position:relative}
.cq-modal:not(.pysky-about-modal)::before,.cq-input-modal::before,.cq-support-modal::before,.autonomy-shell::before{content:'';position:absolute;right:54px;top:13px;width:28px;height:28px;background:url('/static/img/pysky-icon.png') center/contain no-repeat;filter:drop-shadow(0 0 8px rgba(66,201,255,.25));opacity:.88;pointer-events:none;z-index:4}
@media(max-width:900px){.pysky-top-actions{min-width:0}.pysky-about-btn small{display:none}.pysky-about-grid{grid-template-columns:1fr}.pysky-login-logo{top:35px;left:22px;width:55px;height:55px}}
@media(max-width:700px){.pysky-home-btn b{display:none}.pysky-about-btn b{font-size:10px}.pysky-top-actions{gap:6px}.pysky-about-logo{width:70px;height:70px}.auth-product-line{padding:0 12px}}


/* === PySky 40.4.4 · topbar balance + PayPal support === */
@media (min-width:901px){
  .main>.topbar{
    display:grid!important;
    grid-template-columns:minmax(330px,1fr) auto minmax(310px,1fr)!important;
    align-items:center!important;
    column-gap:18px!important;
    width:100%!important;
    padding:0 18px!important;
  }
  .main>.topbar .pysky-top-actions{justify-self:start;min-width:0;width:min(100%,430px)}
  .main>.topbar .pysky-about-btn{min-width:215px;max-width:285px}
  .main>.topbar .pysky-home-btn{flex:0 0 auto}
  .main>.topbar .top-stats{margin-left:0!important;justify-self:center;display:flex!important}
  .main>.topbar .top-stats>div{min-width:92px;padding:0 16px}
  .pysky-top-meta{justify-self:end;display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}
  .pysky-top-meta .profile-chip{flex:0 0 auto}
}
@media (min-width:901px) and (max-width:1280px){
  .main>.topbar{grid-template-columns:minmax(250px,.9fr) auto minmax(250px,.9fr)!important;column-gap:10px!important}
  .pysky-about-btn small{display:none}
  .pysky-about-btn{max-width:220px!important}
  .main>.topbar .top-stats>div{min-width:78px;padding:0 10px}
  .admin-root-badge{font-size:7px!important;padding-left:7px!important;padding-right:7px!important}
}
.pysky-donate-backdrop{z-index:1950!important;background:rgba(2,7,16,.88)!important;backdrop-filter:blur(13px)}
.pysky-donate-modal{width:min(720px,94vw)!important;max-width:720px!important;padding:30px!important;text-align:center;background:radial-gradient(circle at 50% -15%,rgba(237,82,142,.18),transparent 38%),radial-gradient(circle at 0 100%,rgba(255,174,63,.10),transparent 34%),linear-gradient(180deg,#0e1b2d,#081421)!important;border:1px solid #5e3e61!important}
.pysky-donate-logo{width:88px;height:88px;object-fit:contain;filter:drop-shadow(0 0 24px rgba(67,200,255,.35));margin:0 auto 6px;display:block}
.pysky-donate-modal h2{margin:7px auto 10px;font-size:29px;letter-spacing:-.04em;max-width:580px}
.pysky-donate-lead{margin:0 auto;color:#aabbd0;line-height:1.62;max-width:590px;font-size:12px}
.pysky-donate-options{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin:22px 0 16px}
.pysky-donate-options>a{min-height:132px;padding:17px 12px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;text-decoration:none;border:1px solid #354967;border-radius:16px;background:linear-gradient(180deg,#11233a,#0b192a);color:#eef5fc;transition:.18s ease}
.pysky-donate-options>a:hover{transform:translateY(-3px);border-color:#ff9f65;box-shadow:0 14px 32px rgba(0,0,0,.26),0 0 25px rgba(255,103,143,.08)}
.pysky-donate-options span{font-size:24px}.pysky-donate-options b{font-size:22px;color:#ffc06a}.pysky-donate-options small{font-size:9px;color:#8fa4bc}
.pysky-paypal-open{display:flex!important;width:min(360px,100%);justify-content:center;margin:0 auto;text-decoration:none}
.pysky-donate-note{margin:14px auto 0;color:#70849a;font-size:9px;line-height:1.5;max-width:500px}
@media(max-width:900px){.pysky-top-meta{display:none}.pysky-donate-options{grid-template-columns:1fr}.pysky-donate-options>a{min-height:82px;display:grid;grid-template-columns:42px 70px 1fr;text-align:left}.pysky-donate-modal{padding:23px 16px!important;max-height:90dvh;overflow:auto}.pysky-donate-modal h2{font-size:23px}}

/* === PySky 40.4.5 · mobile scroll + brand collision fix === */
@media (max-width:900px){
  /* Use the native document scroll on phones. This avoids viewport/fixed-scroll
     bugs in Chrome/Safari while keeping the mobile chrome pinned. */
  html,body{
    width:100%!important;
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body{min-height:100dvh!important}
  body.mobile-drawer-open,
  body.modal-open,
  body.achievement-celebrating{overflow:hidden!important}

  .app-shell,
  .main{
    position:static!important;
    width:100%!important;
    height:auto!important;
    min-height:100dvh!important;
    overflow:visible!important;
  }

  .dashboard-grid.clean-dashboard{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:var(--mobile-top) 0 0!important;
    padding:12px 10px calc(var(--mobile-bottom) + 26px)!important;
    overflow:visible!important;
    overscroll-behavior:auto!important;
  }

  /* Mobile brand in the fixed app bar must never compress/overlap. */
  .mobile-brand.pysky-brand-with-logo{
    min-width:0!important;
    width:max-content!important;
    max-width:100%!important;
    gap:7px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:visible!important;
  }
  .mobile-brand.pysky-brand-with-logo>img{
    width:30px!important;
    height:30px!important;
    flex:0 0 30px!important;
  }
  .mobile-brand.pysky-brand-with-logo>span{
    display:inline-flex!important;
    align-items:baseline!important;
    white-space:nowrap!important;
    font-size:19px!important;
    line-height:1!important;
    letter-spacing:-.6px!important;
  }
  .mobile-brand.pysky-brand-with-logo>span>span{
    display:inline!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    position:static!important;
  }

  /* Login/register: override desktop inline positioning and prevent Py/Sky
     from colliding on narrow screens. */
  .cq-auth-identity .auth-art>.brand-large{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    margin:16px 0 0 72px!important;
    padding:0!important;
    display:flex!important;
    justify-content:flex-start!important;
    align-items:baseline!important;
    text-align:left!important;
    font-size:34px!important;
    line-height:1!important;
    letter-spacing:-1.2px!important;
    white-space:nowrap!important;
    z-index:7!important;
  }
  .cq-auth-identity .auth-art>.brand-large>span{
    display:inline-flex!important;
    align-items:baseline!important;
    white-space:nowrap!important;
    line-height:1!important;
  }
  .cq-auth-identity .auth-art>.brand-large>span>span{
    position:static!important;
    display:inline!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    line-height:1!important;
  }
  .pysky-login-logo{
    top:22px!important;
    left:18px!important;
    width:48px!important;
    height:48px!important;
  }
  .cq-auth-identity .auth-copy{
    margin-top:30px!important;
  }
}

@media (max-width:390px){
  .mobile-appbar{grid-template-columns:38px minmax(0,1fr) 38px 34px!important;gap:5px!important;padding-left:7px!important;padding-right:7px!important}
  .mobile-brand.pysky-brand-with-logo>img{width:27px!important;height:27px!important;flex-basis:27px!important}
  .mobile-brand.pysky-brand-with-logo>span{font-size:17px!important;letter-spacing:-.5px!important}
  .cq-auth-identity .auth-art>.brand-large{font-size:30px!important;margin-left:64px!important}
  .pysky-login-logo{width:42px!important;height:42px!important}
}


/* === PySky 40.4.7 · verified mobile auth + donation hardening === */
/* Donation modal: explicit image constraints to avoid generic modal/image rules. */
#pysky-donate-modal .pysky-donate-modal{
  box-sizing:border-box!important;
  width:min(720px,94vw)!important;
  max-width:720px!important;
  max-height:min(860px,92dvh)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
#pysky-donate-modal .pysky-donate-logo{
  display:block!important;
  position:static!important;
  float:none!important;
  width:88px!important;
  max-width:88px!important;
  height:88px!important;
  max-height:88px!important;
  object-fit:contain!important;
  margin:0 auto 6px!important;
  transform:none!important;
}
#pysky-donate-modal[hidden]{display:none!important}

@media (max-width:900px){
  html,body{
    height:auto!important;
    min-height:100%!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:auto!important;
  }
  body{min-height:100dvh!important}

  /* Auth pages must use document flow; no fixed-height/hidden parent may trap scrolling. */
  .cq-auth-identity.auth-shell{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-height:100dvh!important;
    height:auto!important;
    overflow:visible!important;
  }
  .cq-auth-identity .auth-art{
    flex:0 0 auto!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
    padding:18px 16px 24px!important;
  }
  .cq-auth-identity .auth-panel{
    flex:0 0 auto!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
    padding:24px 16px calc(36px + env(safe-area-inset-bottom))!important;
  }

  /* Login identity: override every desktop inline absolute rule. */
  .cq-auth-identity .pysky-login-logo{
    position:absolute!important;
    top:18px!important;
    left:16px!important;
    width:48px!important;
    max-width:48px!important;
    height:48px!important;
    max-height:48px!important;
    object-fit:contain!important;
    z-index:8!important;
  }
  .cq-auth-identity .auth-art>.brand-large{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:auto!important;
    max-width:calc(100vw - 102px)!important;
    height:48px!important;
    min-height:48px!important;
    margin:0 0 18px 62px!important;
    padding:0!important;
    display:flex!important;
    flex-flow:row nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:0!important;
    overflow:visible!important;
    white-space:nowrap!important;
    text-align:left!important;
    font-size:32px!important;
    line-height:1!important;
    letter-spacing:-1.1px!important;
    transform:none!important;
    z-index:7!important;
  }
  .cq-auth-identity .auth-art>.brand-large>span{
    position:static!important;
    inset:auto!important;
    display:inline-block!important;
    width:auto!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    line-height:1!important;
    white-space:nowrap!important;
    transform:none!important;
  }
  .cq-auth-identity .auth-art>.brand-large>span:nth-child(2){
    margin-left:0!important;
    transform:translateY(3px)!important;
  }
  .cq-auth-identity .auth-copy{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
  }
  .cq-auth-identity .cq-manifest h1{
    font-size:clamp(31px,9.5vw,40px)!important;
    line-height:1.02!important;
    letter-spacing:-1.3px!important;
  }
  .cq-auth-identity .integrity-manifest{margin-bottom:0!important}
  .cq-auth-card{width:min(100%,470px)!important}

  #pysky-donate-modal{
    padding:12px!important;
    align-items:center!important;
    justify-items:center!important;
    overflow-y:auto!important;
  }
  #pysky-donate-modal .pysky-donate-modal{
    width:min(100%,680px)!important;
    max-height:calc(100dvh - 24px)!important;
    margin:auto!important;
    padding:22px 15px!important;
    border-radius:18px!important;
  }
  #pysky-donate-modal .pysky-donate-logo{
    width:70px!important;
    max-width:70px!important;
    height:70px!important;
    max-height:70px!important;
  }
  #pysky-donate-modal .pysky-donate-options{
    grid-template-columns:1fr!important;
    gap:8px!important;
    margin:16px 0 12px!important;
  }
  #pysky-donate-modal .pysky-donate-options>a{
    min-height:70px!important;
    display:grid!important;
    grid-template-columns:38px 65px 1fr!important;
    align-items:center!important;
    text-align:left!important;
  }
}

@media (max-width:390px){
  .cq-auth-identity .pysky-login-logo{
    width:42px!important;max-width:42px!important;height:42px!important;max-height:42px!important;
  }
  .cq-auth-identity .auth-art>.brand-large{
    height:42px!important;min-height:42px!important;margin-left:54px!important;font-size:28px!important;
    max-width:calc(100vw - 84px)!important;
  }
}

/* v40.4.13 · recuperación de cuenta + buzón PySky */
.auth-recover-link{margin:10px 0 0!important;text-align:right!important;font-size:11px!important}.auth-recover-link a{color:#79dfff;text-decoration:none}.auth-recover-link a:hover{color:#fff;text-decoration:underline}
.feedback-form{display:grid;gap:14px;padding:18px;border-radius:18px;border:1px solid rgba(117,142,186,.18);background:linear-gradient(180deg,rgba(17,26,42,.9),rgba(11,19,33,.96))}.feedback-grid{display:grid;grid-template-columns:minmax(180px,.45fr) minmax(0,1fr);gap:12px}.feedback-form label{display:grid;gap:7px;color:#a9bdd3;font-size:11px;font-weight:700;letter-spacing:.03em}.feedback-form input,.feedback-form select,.feedback-form textarea{width:100%;box-sizing:border-box;border:1px solid rgba(117,142,186,.28);border-radius:11px;background:#091523;color:#eef7ff;padding:11px 12px;font:inherit;outline:none}.feedback-form textarea{resize:vertical;min-height:150px;line-height:1.5}.feedback-form input:focus,.feedback-form select:focus,.feedback-form textarea:focus{border-color:#46d4d0;box-shadow:0 0 0 2px rgba(70,212,208,.10)}.feedback-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.feedback-actions small{color:#8195aa;font-size:10px}.feedback-status{min-height:18px;font-size:11px;font-weight:700}.feedback-status.success{color:#61dfa0}.feedback-status.error{color:#ff8ca6}@media(max-width:700px){.feedback-grid{grid-template-columns:1fr}.feedback-actions{align-items:stretch;flex-direction:column}.feedback-actions .btn{width:100%}}

/* v40.4.14 · buzón: confirmación modal temporal al enviar */
.feedback-success-backdrop{z-index:1450;opacity:0;transition:opacity .18s ease}.feedback-success-backdrop.show{opacity:1}.feedback-success-backdrop.fade{opacity:0}.feedback-success-modal{width:min(390px,90vw);text-align:center;padding:28px 24px}.feedback-success-icon{width:62px;height:62px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center;font-size:31px;font-weight:900;color:#06141a;background:linear-gradient(135deg,#61dfa0,#46d4d0);box-shadow:0 12px 30px rgba(70,212,208,.2)}.feedback-success-modal h2{margin:7px 0 8px}.feedback-success-modal p{margin:0;color:#a9bdd3;font-size:13px;line-height:1.5}


/* v40.4.15 · cuentas certificadas: certificado como home + repaso reversible */
.certificate-nav[hidden]{display:none!important}
.cq-final-certificate.certificate-home{
  position:relative;
  overflow:hidden;
  width:min(100%,980px);
  min-height:0;
  padding:clamp(28px,4vw,48px);
  grid-template-columns:96px minmax(0,1fr);
  align-items:center;
  border-color:rgba(245,158,11,.48);
  background:
    radial-gradient(circle at 8% 12%,rgba(245,158,11,.16),transparent 30%),
    radial-gradient(circle at 88% 88%,rgba(139,92,246,.15),transparent 35%),
    linear-gradient(145deg,rgba(10,22,37,.98),rgba(19,24,48,.98));
  box-shadow:0 24px 80px rgba(2,6,23,.42),inset 0 1px 0 rgba(255,255,255,.04);
}
.cq-final-certificate.certificate-home:after{
  content:"PYSKY";
  position:absolute;
  right:-12px;
  bottom:-24px;
  font-size:clamp(74px,10vw,150px);
  line-height:1;
  font-weight:1000;
  letter-spacing:-.06em;
  color:rgba(255,255,255,.025);
  pointer-events:none;
}
.certificate-home .graduation-seal{font-size:76px;align-self:start}
.certificate-home .graduation-certificate-copy{position:relative;z-index:1;min-width:0}
.certificate-home .card-title{color:#f472b6;letter-spacing:.11em}
.certificate-home h2{font-size:clamp(30px,3.5vw,50px);margin:7px 0 10px}
.certificate-home .graduation-stats{margin:20px 0 16px}
.certificate-home .graduation-stats span{background:rgba(15,23,42,.48);border-color:rgba(245,158,11,.2)}
.certificate-home .graduation-actions{margin-top:22px}

@media (min-width:901px){
  body.cq-final-screen .dashboard-grid.clean-dashboard{
    display:grid!important;
    place-items:center!important;
    height:100dvh!important;
    min-height:100dvh!important;
    padding:clamp(20px,3vw,44px)!important;
    overflow:auto!important;
  }
  body.cq-final-screen #slot-graduation{
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
  }
  body.cq-final-screen #slot-graduation > .cq-final-certificate.certificate-home{
    width:min(100%,980px)!important;
    min-height:0!important;
    height:auto!important;
    margin:auto!important;
    border-radius:24px!important;
  }
}
@media (max-width:900px){
  body.cq-final-screen .dashboard-grid.clean-dashboard{display:grid!important;place-items:center!important}
  body.cq-final-screen #slot-graduation{display:grid!important;place-items:center!important;min-height:100%!important}
  body.cq-final-screen #slot-graduation > .cq-final-certificate.certificate-home{width:min(100%,720px)!important;min-height:0!important;height:auto!important}
}
@media (max-width:700px){
  .cq-final-certificate.certificate-home{grid-template-columns:1fr;text-align:center;padding:24px 18px}
  .certificate-home .graduation-seal{font-size:54px;justify-self:center}
  .certificate-home .graduation-stats{justify-content:center}
  .certificate-home .graduation-actions{display:grid;grid-template-columns:1fr}
  .certificate-home .graduation-actions .btn{width:100%;justify-content:center;text-align:center}
}


/* v40.4.16 · certificado centrado a lienzo completo + selector de repasos funcional */
@media (min-width:901px){
  body.cq-final-screen .main{
    min-height:100vh!important;
    height:100vh!important;
  }
  body.cq-final-screen .dashboard-grid.clean-dashboard{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:100vh!important;
    min-height:100vh!important;
    padding:clamp(28px,3.5vw,64px)!important;
    overflow:auto!important;
  }
  body.cq-final-screen #slot-graduation{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    margin:0!important;
  }
  body.cq-final-screen #slot-graduation > .cq-final-certificate.certificate-home{
    width:min(94%,1280px)!important;
    min-height:min(72vh,700px)!important;
    height:auto!important;
    margin:auto!important;
    padding:clamp(42px,5vw,76px)!important;
    grid-template-columns:132px minmax(0,1fr)!important;
    align-content:center!important;
    align-items:center!important;
    border-radius:30px!important;
  }
  body.cq-final-screen .certificate-home .graduation-seal{font-size:96px!important;align-self:center!important}
  body.cq-final-screen .certificate-home h2{font-size:clamp(42px,4.5vw,68px)!important}
  body.cq-final-screen .certificate-home>*,
  body.cq-final-screen .certificate-home .graduation-certificate-copy{min-width:0!important}
  body.cq-final-screen .certificate-home .graduation-certificate-copy>p{font-size:clamp(14px,1.25vw,18px)!important;line-height:1.55!important}
  body.cq-final-screen .certificate-home .graduation-stats{gap:12px!important;margin:26px 0 20px!important}
  body.cq-final-screen .certificate-home .graduation-stats span{padding:11px 15px!important;font-size:14px!important}
  body.cq-final-screen .certificate-home .graduation-actions{gap:12px!important;margin-top:28px!important;flex-wrap:wrap!important}
  body.cq-final-screen .certificate-home .graduation-actions .btn{padding:12px 16px!important;font-size:12px!important}
}
@media (max-width:900px){
  body.cq-final-screen .dashboard-grid.clean-dashboard{
    display:flex!important;align-items:center!important;justify-content:center!important;
  }
  body.cq-final-screen #slot-graduation{
    display:flex!important;align-items:center!important;justify-content:center!important;min-height:100%!important;
  }
  body.cq-final-screen #slot-graduation > .cq-final-certificate.certificate-home{
    width:min(96%,760px)!important;margin:auto!important;min-height:0!important;
  }
}

/* PySky 40.4.18 · onboarding contract scroll / signature dock */
.onboarding-shell{
  min-height:100vh;
  min-height:100svh;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.contract-stage{
  width:min(820px,94vw)!important;
  min-height:0;
}
.contract-stage .cq-contract{
  display:flex;
  flex-direction:column;
  width:100%;
  max-height:calc(100vh - 72px);
  max-height:calc(100svh - 72px);
  min-height:0;
  padding:0!important;
  overflow:hidden!important;
}
.contract-stage .contract-head{
  flex:0 0 auto;
  padding:24px 28px 18px;
  background:linear-gradient(180deg,rgba(14,28,48,.995),rgba(11,24,42,.985));
}
.contract-scroll-body{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
  padding:18px 28px 8px;
}
.contract-scroll-body:focus{outline:1px solid rgba(255,183,95,.35);outline-offset:-1px}
.contract-scroll-body::-webkit-scrollbar{width:9px}
.contract-scroll-body::-webkit-scrollbar-track{background:#081625}
.contract-scroll-body::-webkit-scrollbar-thumb{background:#36506f;border:2px solid #081625;border-radius:999px}
.contract-acceptance-dock{
  flex:0 0 auto;
  position:relative;
  z-index:3;
  padding:12px 28px 16px;
  border-top:1px solid #304967;
  background:linear-gradient(180deg,rgba(11,25,43,.99),rgba(6,16,29,.997));
  box-shadow:0 -18px 34px rgba(0,0,0,.32);
}
.contract-acceptance-dock .contract-check{margin:0 0 10px!important;padding:11px 13px!important}
.contract-acceptance-dock .contract-actions{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px}
.contract-acceptance-dock .contract-actions .btn{min-height:40px}
.contract-acceptance-dock .contract-hash{margin-top:9px}
@media(max-width:700px){
  .onboarding-shell{place-items:start center;padding:14px 10px 24px!important}
  .contract-stage{width:100%!important}
  .contract-stage .cq-contract{max-height:calc(100svh - 28px);border-radius:14px}
  .contract-stage .contract-head{padding:18px 16px 14px;gap:10px}
  .contract-stage .contract-head h1{font-size:23px}
  .contract-stage .contract-head>strong{font-size:9px;padding:7px 8px}
  .contract-scroll-body{padding:14px 16px 6px}
  .contract-clause{grid-template-columns:38px minmax(0,1fr);gap:10px;padding:13px 0}
  .contract-acceptance-dock{padding:10px 16px 12px}
  .contract-acceptance-dock .contract-actions{grid-template-columns:1fr}
  .contract-acceptance-dock .contract-check{font-size:10px!important}
}
@media(max-height:680px) and (min-width:701px){
  .onboarding-shell{padding:18px}
  .contract-stage .cq-contract{max-height:calc(100svh - 36px)}
  .contract-stage .contract-head{padding:16px 22px 12px}
  .contract-scroll-body{padding:12px 22px 6px}
  .contract-clause{padding:11px 0}
  .contract-acceptance-dock{padding:9px 22px 11px}
}