/* Haz un Test · Sistema visual Aula. Capa de presentación compartida por la SPA. Los estilos estructurales del motor siguen en styles.css; aquí se centralizan superficies e interacción. */ :root{ color-scheme:light; --font-body:"Segoe UI Variable Text","Segoe UI",system-ui,sans-serif; --font-display:"Segoe UI Variable Display","Segoe UI",system-ui,sans-serif; --bg:#f5f6f2;--panel:#fff;--panel-2:#f1f5f2;--card:#fff; --text:#20362f;--muted:#53665b;--border:#dce5de; --orange:#17634d;--orange-dark:#104d3c;--orange-light:#24765d;--gold:#17634d; --blue:#245e8f;--green:#16704d;--red:#b33642; --radius-sm:8px;--radius-md:14px;--radius-lg:20px; --shadow:0 8px 28px #20362f09;--shadow-sm:0 2px 5px #20362f05; --shadow-md:0 8px 28px #20362f0a;--shadow-lg:0 24px 70px #163a2926; --shadow-card-rest:0 2px 6px #20362f04;--shadow-card-hover:0 12px 30px #20362f0d; --glow-accent:0 4px 12px #17634d15;--glow-accent-strong:0 6px 20px #17634d20; --color-neutral-100:#20362f;--color-neutral-200:#354b42;--color-neutral-300:#4b6056; --color-neutral-400:#61736b;--color-neutral-500:#73877d;--color-neutral-600:#a5b7ac; --color-neutral-700:#dce5de;--color-neutral-800:#edf2ed;--color-neutral-900:#f5f6f2; --color-accent-100:#104d3c;--color-accent-200:#17634d;--color-accent-300:#24765d; --color-accent-400:#39866b;--color-accent-500:#4a987b;--color-accent-600:#90bca6; --color-accent-700:#c3dfce;--color-accent-800:#dfefe5;--color-accent-900:#edf5ef; --content-max:1320px;--content-half:660px;--side-nav-width:224px;--side-nav-half:112px; --page-gutter:clamp(20px,3.2vw,52px);--bottom-nav-height:76px; } html{scroll-padding-top:100px} body{background:var(--bg);color:var(--text);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased} body::before{display:none} button,input,select,textarea{font:inherit} button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent} button:disabled{cursor:not-allowed;opacity:.52;transform:none!important;box-shadow:none!important} :focus-visible{outline:3px solid #31836a;outline-offset:4px} ::selection{background:#d4eac6;color:#143e31} [hidden]{display:none!important} .skip-link{position:fixed;left:16px;top:-90px;z-index:2200;padding:10px 18px;border-radius:10px;background:var(--orange);color:#fff} .skip-link:focus{top:12px} body.has-bottom-nav{padding-right:0} main#app{max-width:var(--content-max);padding:34px var(--page-gutter) 52px;margin:0 auto;min-height:calc(100vh - 190px);outline:none} .topbar,body.has-bottom-nav .topbar{height:82px;min-height:82px;background:#f5f6f2eb;backdrop-filter:blur(18px);border-bottom:1px solid var(--border);box-shadow:none;padding:12px var(--page-gutter);gap:20px;position:sticky;top:0;z-index:960} .brand{gap:10px;background:none;box-shadow:none;color:var(--text);flex-shrink:0;min-height:44px} .brand-icon{width:42px;height:42px;padding:0;background:#e5eee5;border:0;border-radius:13px;box-shadow:none;overflow:hidden;display:grid;place-items:center} .brand-icon img{width:40px;height:40px;object-fit:contain;filter:none} .brand strong{font-size:20px;letter-spacing:-.7px;color:var(--text)} .brand small{font-size:10px;color:var(--muted);letter-spacing:0;font-weight:500} .workspace-context{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted);min-width:0;flex:1} .workspace-context span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-weight:600} .header-actions{display:flex;align-items:center;gap:10px;margin-left:auto} .command-trigger{display:flex;align-items:center;gap:9px;min-height:44px;padding:9px 12px;border:1px solid var(--border);background:var(--panel);border-radius:10px;color:var(--muted);cursor:pointer;font-size:12px} .ui-icon{width:20px;height:20px;flex-shrink:0;vertical-align:middle} kbd{font:11px var(--font-body);border:1px solid var(--border);border-bottom-width:2px;border-radius:4px;padding:0 5px;color:var(--muted);background:var(--bg)} .header-account{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border:1px solid #c6d9cc;border-radius:50%;background:#e7efdf;color:var(--orange);font-weight:700;cursor:pointer} .nav-heading,.nav-note,.nav-extra{display:none} .nav-extra-item{display:flex;align-items:center;gap:12px;min-height:48px;padding:12px 14px;width:100%;border:0;border-radius:12px;background:transparent;color:var(--muted);text-align:left;cursor:pointer;font-size:13px;font-weight:600} .nav-extra-item:hover,.nav-extra-item.active{background:#edf4e7;color:var(--orange)} .bottom-nav{background:#ffffffed;border-color:var(--border);backdrop-filter:blur(18px);box-shadow:0 -4px 20px #20362f06} .bottom-nav-item{font-weight:600;color:var(--muted);border-radius:12px} .bottom-nav-item.active{color:var(--orange)} .bottom-nav-icon-circle{color:#fff;background:var(--orange);border:4px solid var(--bg);box-shadow:0 5px 12px #17634d25;width:54px;height:54px;border-radius:18px;transform:none} .bottom-nav-item:hover,.bottom-nav-item-center:hover{transform:none} .bottom-nav-item-center.active{color:var(--orange)} .bottom-nav-dot{background:var(--orange);border-color:#fff} @media(min-width:901px){ body.has-bottom-nav{padding-left:var(--side-nav-width);padding-right:0} body.has-bottom-nav .topbar{padding-left:var(--page-gutter);padding-right:var(--page-gutter)} .topbar,body.has-bottom-nav .topbar{backdrop-filter:none} body.has-bottom-nav .topbar>.brand{position:fixed;top:20px;left:22px;z-index:1000;max-width:calc(var(--side-nav-width) - 40px)} body.has-bottom-nav #bottomNav{top:0;bottom:0;left:0;right:auto;width:var(--side-nav-width);padding:112px 16px 20px;justify-content:flex-start;align-items:stretch;gap:6px;border:0;border-right:1px solid var(--border);background:#fff;box-shadow:none;overflow-y:auto} .nav-heading{display:block;padding:0 14px 9px;font-size:10px;font-weight:700;letter-spacing:1.7px;text-transform:uppercase;color:var(--muted)} .bottom-nav-item,.bottom-nav-side>.bottom-nav-item{flex:none;flex-direction:row;justify-content:flex-start;align-items:center;gap:12px;min-height:48px;padding:12px 14px;width:100%;margin:0} .bottom-nav-label{font-size:13px;line-height:1.3;text-align:left;max-width:none;width:auto} .bottom-nav-item .bottom-nav-icon,.bottom-nav-item .bottom-nav-icon-circle{width:22px;height:22px;margin:0;box-shadow:none;border:0;background:none;color:inherit;border-radius:0} .bottom-nav-icon svg,.bottom-nav-icon-circle svg{width:21px;height:21px} .bottom-nav-item-center{background:var(--orange);color:#fff;margin:6px 0} .bottom-nav-item-center.active{background:var(--orange-dark);color:#fff} .bottom-nav-item.active:not(.bottom-nav-item-center){background:#eaf2eb;color:var(--orange)} .bottom-nav-item.active:not(.bottom-nav-item-center)::before{width:3px;height:18px;top:50%;left:0;transform:translateY(-50%);border-radius:0 3px 3px 0} .bottom-nav-item:hover{background:#f0f5ef;transform:none} .bottom-nav-item-center:hover{background:var(--orange-dark);color:#fff} .bottom-nav-item-center:hover .bottom-nav-icon-circle{background:none} .nav-extra{display:grid;gap:5px;border-top:1px solid var(--border);margin-top:20px;padding-top:20px} .nav-note{display:block;margin-top:auto;padding:36px 12px 4px;color:var(--muted);font-size:11px} .nav-note strong{display:block;color:var(--text);font-size:12px;margin:6px 0 4px} .nav-note .ui-icon{color:var(--orange)} } .panel,.test-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card-rest);padding:clamp(20px,2.5vw,34px)} .panel::before,.panel::after{pointer-events:none} .section-title,.study-screen-title h1{font-size:clamp(25px,2.8vw,35px);line-height:1.2;font-weight:700;letter-spacing:-1.1px;color:var(--text);padding-bottom:0} .section-title::after{display:none} .h1{color:var(--text);background:none;filter:none;-webkit-text-fill-color:currentColor;letter-spacing:-2.4px;font-weight:700} .kicker{font-size:10px;letter-spacing:1.7px;font-weight:700;color:var(--orange);text-transform:uppercase;margin-bottom:10px} .lead{font-size:15px;line-height:1.8;color:var(--muted)} .muted{color:var(--muted)} .btn{min-height:44px;padding:11px 19px;border-radius:11px;font-size:13px;font-weight:650;letter-spacing:0;box-shadow:none;line-height:1.4} .btn-primary,.btn-study-cta,.btn-primary.btn-study-cta{background:var(--orange);border:1px solid var(--orange);color:#fff;box-shadow:0 3px 7px #17634d12} .btn-primary:hover,.btn-primary.btn-study-cta:hover{background:var(--orange-dark);color:#fff;box-shadow:0 6px 16px #17634d20;border-color:var(--orange-dark)} .btn-secondary{background:#fff;color:var(--text);border:1px solid #ccd9d0} .btn-secondary:hover{background:#edf4ed;color:var(--orange);border-color:#8eaf9c} .btn-ghost{background:transparent;color:var(--orange);border:1px solid transparent} .btn-ghost:hover{background:#edf4ed;color:var(--orange-dark)} .btn-small{min-height:36px;padding:7px 12px;font-size:12px} .btn.danger,.danger{color:var(--red)} .btn::before,.btn::after{box-shadow:none} .field label{font-size:12px;font-weight:650;color:var(--text);margin-bottom:7px} .field input,.field select,.field textarea,input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{background:#fbfcfa;color:var(--text);border:1px solid #cbd8ce;border-radius:10px;box-shadow:none;min-height:44px} .field input:focus,.field select:focus,.field textarea:focus,input:focus,select:focus,textarea:focus{border-color:#31836a;box-shadow:0 0 0 3px #31836a15;outline:none} input::placeholder,textarea::placeholder{color:#718177;opacity:1} input[type=checkbox],input[type=radio]{accent-color:var(--orange)} input[type=file]{color:var(--muted);font-size:12px} input[type=file]::file-selector-button{background:#edf4ed;color:var(--orange);border:1px solid var(--border);border-radius:8px;padding:9px 13px;margin-right:10px;cursor:pointer} .home-shell{gap:28px;display:grid} .home-hero{gap:26px;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);align-items:stretch} .home-hero-copy{padding:42px 36px;background:#e9f0e3;border:1px solid #dde6d6;box-shadow:none;position:relative;overflow:hidden;border-radius:22px} .home-hero-copy::after{content:"";position:absolute;right:-85px;top:-110px;width:280px;height:280px;border:1px solid #66856620;border-radius:50%;box-shadow:0 0 0 35px #66856608,0 0 0 70px #66856605;pointer-events:none} .home-hero-copy .kicker{position:relative;z-index:1;display:flex;align-items:center;gap:8px} .home-hero-copy .kicker::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--orange)} .home-hero-copy .h1{font-size:clamp(34px,3.9vw,57px);line-height:1.08;max-width:550px;margin:20px 0} .home-hero-copy .lead{font-size:14px;max-width:500px;color:#4c6456} .home-hero-copy .cta-row{margin-top:26px;gap:10px;position:relative;z-index:1} .hero-chip-row{gap:8px;margin-top:24px} .hero-chip{padding:5px 0;background:none;border:0;font-size:10px;color:#4c6456;box-shadow:none;display:inline-flex;align-items:center;gap:5px} .hero-chip::before{content:"✓";color:var(--orange);font-weight:800} .hero-chip+.hero-chip{margin-left:9px} .hero-claim{font-size:11px;line-height:1.65;border-top:1px solid #cad9c6;padding-top:17px;margin-top:18px;color:#4c6456;background:none;box-shadow:none} .hero-claim-icon{color:var(--orange);background:#d6e5cd;border-color:transparent} .hero-carousel-panel{background:linear-gradient(145deg,#eef3eb,#fff);border-color:var(--border);box-shadow:none;border-radius:22px} .hero-carousel-card{background:#fff;border-color:#bfcfc2;color:var(--text);box-shadow:inset 0 0 45px #eaf0e7} .hero-carousel-card-title{color:var(--text)} .hero-carousel-card-stats dt{color:var(--muted)} .hero-carousel-card-stats dd{color:var(--orange)} .hero-carousel-card-badge{background:#f4eddc;color:#826128;border-color:#e5d9be} .hero-carousel-nav{background:#fff;color:var(--orange);border-color:var(--border);box-shadow:none} .hero-carousel-dot{background:#afc3b6} .hero-carousel-dot.active,.hero-carousel-dot[aria-current=true]{background:var(--orange)} .section-shell{margin:0} .home-oppositions{gap:16px;margin-top:24px} .opposition-card.available.opposition-card-compact{position:relative;display:flex;flex-direction:column;text-align:left;width:100%;background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:none;padding:24px;min-height:172px;cursor:pointer;transition:transform .2s,border-color .2s,box-shadow .2s;color:var(--text);font:inherit} .opposition-card.available.opposition-card-compact:hover{transform:translateY(-4px);border-color:#7d9f8a;box-shadow:var(--shadow-card-hover);background:#fff} .opposition-card-compact .opposition-card-content{width:100%} .home-oppositions .opposition-card-compact .opposition-card-content{padding:0;min-width:0} .home-oppositions .opposition-card-compact h3{font-size:20px;line-height:1.3;letter-spacing:-.4px;overflow-wrap:normal;word-break:normal} .opposition-card-compact .opposition-card-heading{align-items:flex-start;gap:14px} .opposition-card-compact .opposition-card-heading>div:last-child{min-width:0;flex:1} .opposition-card-compact .opposition-icon-shell{width:48px;height:48px;flex:0 0 48px;padding:5px;border:1px solid var(--border);border-radius:12px;background:#f4f7f0;box-shadow:none} .home-oppositions .opposition-card .opposition-icon{width:100%;height:100%;max-width:none;object-fit:contain;filter:none} .home-oppositions .opposition-card-compact .opposition-card-meta{margin-top:18px;padding:0;display:flex;flex-wrap:wrap;gap:8px} .opposition-card-compact .opposition-meta-chip{padding:5px 9px;min-height:30px;font-size:11px;flex:0 1 auto} .opposition-card-compact .opposition-card-heading{padding-right:30px} .opposition-card-compact h3{color:var(--text);font-size:19px;font-weight:650;line-height:1.3;letter-spacing:-.4px} .opposition-card-compact .opposition-card-subtitle{color:var(--muted);font-size:12px;line-height:1.7} .opposition-meta-chip{background:#f0f5ee;border:1px solid #e0e9dc;color:#4f6c57;border-radius:7px;font-size:11px} .opposition-card-compact::after{content:"↗";position:absolute;right:20px;top:24px;display:grid;place-items:center;width:32px;height:32px;background:#eaf2e7;border-radius:50%;color:var(--orange);font-size:19px} .offer-panel{display:grid;grid-template-columns:1fr 1.25fr;gap:32px;background:#fff;border:1px solid var(--border)} .offer-intro .section-title{font-size:27px;letter-spacing:-.7px} .offer-intro .muted{font-size:13px} .offer-checklist{display:grid;gap:12px} .offer-checklist li{color:var(--text);font-size:13px} .offer-check{background:#e7f1e4;color:var(--orange);border:0} .demo-card{background:#f6f8f3;border:1px solid #dce5d8;border-radius:16px;padding:22px} .demo-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;color:var(--muted);margin-bottom:15px} .demo-tag{display:flex;align-items:center;gap:6px;font-weight:650;color:var(--orange);letter-spacing:.4px} .demo-card h3{font-size:15px;line-height:1.6;margin:0 0 14px;color:var(--text);font-weight:650} .demo-options{display:grid;gap:7px} .demo-option{width:100%;display:flex;gap:10px;align-items:center;text-align:left;padding:9px 12px;min-height:40px;background:#fff;border:1px solid var(--border);border-radius:9px;color:var(--text);font-size:12px;cursor:pointer;transition:background .15s,border-color .15s} .demo-option span{display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--border);border-radius:6px;font-size:10px;color:var(--muted);flex-shrink:0} .demo-option:hover{border-color:var(--orange);background:#edf5e9} .demo-option.is-correct{border-color:#378661;background:#e7f3e8} .demo-option.is-wrong{border-color:#bd6268;background:#fff1f1} .demo-feedback{font-size:12px;color:var(--muted);line-height:1.65;margin:13px 0 0;min-height:40px} .demo-feedback strong{color:var(--orange)} .demo-reset{background:none;border:0;color:var(--orange);font-size:11px;text-decoration:underline;cursor:pointer;padding:4px 0} .community-pulse-panel{border-radius:22px;background:#fff;box-shadow:none} .community-pulse-title{font-size:22px;line-height:1.2;letter-spacing:-.6px;color:var(--text)} .community-pulse-intro,.community-pulse-note{color:var(--muted);font-size:11px} .community-live-badge{background:#edf5e8;color:#386943;border:1px solid #d4e5cc} .community-metric,.community-metric.is-online{background:#f5f8f2;border:1px solid #e2e9df;border-radius:13px;box-shadow:none} .community-metric dd{font-size:32px;color:var(--text);font-weight:650;letter-spacing:-1.4px} .community-metric dt,.community-metric small{color:var(--muted)} .community-metric-icon{background:none;color:var(--orange)} .stats{gap:14px;margin:22px 0} .stat{background:#f7f9f5;border:1px solid #e0e8dc;border-radius:14px;padding:20px;box-shadow:none;border-top:2px solid #bbd5be} .stat strong{font-size:clamp(23px,2.3vw,32px);line-height:1.3;color:var(--text);font-weight:650;letter-spacing:-.8px} .stat span{color:var(--muted);font-size:11px;font-weight:500} .stat:hover{transform:none;box-shadow:none;border-color:#bfd2c1} .study-screen-head{grid-template-columns:minmax(0,1fr) auto;gap:14px;padding-bottom:24px;border-bottom:1px solid var(--border);margin-bottom:26px} .study-screen-head>.back-button{grid-column:1/-1;justify-self:start;padding:0;border:0;background:none;min-height:32px;color:var(--muted);font-size:11px;gap:6px} .study-screen-head>.back-button:hover{color:var(--orange)} .study-screen-title h1{font-size:30px} .study-screen-count{border:0;background:#edf4e8;border-radius:14px;min-width:74px;padding:16px} .study-screen-count strong{color:var(--orange)} .opp-group-title{font-size:20px;letter-spacing:-.5px;color:var(--text)} .opp-group-subtitle{font-size:12px;color:var(--muted)} .opp-section-group{border-color:var(--border)} .study-card-grid{gap:16px} .study-card{padding:24px;min-height:148px;border:1px solid var(--border);border-radius:17px;background:#fbfcf9;align-items:flex-start;box-shadow:none;position:relative} .study-card:hover{background:#f4f8ef;border-color:#a3bea6;box-shadow:var(--shadow-card-hover)} .study-card-icon{background:#e6efe0;border:0;color:var(--orange);width:46px;height:46px;border-radius:13px} .study-card[data-study=studySimulator] .study-card-icon{background:#e8eef7;color:#42679b} .study-card[data-study=studyFailed] .study-card-icon{background:#f8eadf;color:#996331} .study-card[data-study=studyPsico] .study-card-icon{background:#ede9f5;color:#746091} .study-card-copy{gap:7px} .study-card-copy strong{font-size:17px;font-weight:650;letter-spacing:-.3px} .study-card-copy small{font-size:12px;line-height:1.7} .study-card-meta{font-size:10px;color:#57705f;background:none;border:0;padding:0;margin-top:8px} .study-card-caret{font-size:20px;margin-left:auto;color:#72927c;transition:transform .2s} .study-card:hover .study-card-caret{transform:translateX(3px)} .quick-start-card{background:#edf4e7;border:1px solid #d5e3cc;border-radius:16px;color:var(--text);padding:28px;box-shadow:none;min-height:125px} .quick-start-card:nth-child(2){background:#edf2f7;border-color:#d9e3ed} .quick-start-card strong{color:var(--text);font-size:20px;letter-spacing:-.5px} .quick-start-card small{color:var(--muted);font-size:12px;opacity:1} .quick-start-card:hover{background:#e4efd9;border-color:#94b789;transform:translateY(-2px)} .simulator-action{background:#fff;border-color:var(--border);border-radius:13px;padding:18px} .simulator-action-icon,.collapsible-icon{background:#edf4e7;border:0;color:var(--orange)} .simulator-action.is-open,.simulator-action:hover{background:#f1f6ec;border-color:#a5bfa4} .simulator-summary{padding:16px;background:#f5f8f1;border-radius:10px;font-size:12px} .simulator-summary-warn{color:#97651e} .topic-grid{gap:12px} .topic-card{background:#fff;border:1px solid var(--border);border-radius:13px;box-shadow:none;overflow:hidden} .topic-card:hover{transform:none;border-color:#aac2ad;box-shadow:none} .topic-header{padding:19px;gap:14px;background:none;color:var(--text)} .topic-header[aria-expanded=true]{background:#f1f6ed} .topic-heading h3{font-size:14px;line-height:1.55;letter-spacing:-.1px} .topic-heading small{font-size:11px} .topic-index{background:#edf3e8;color:var(--orange);border:0;width:36px;height:36px;border-radius:10px;font-size:13px} .topic-config{padding:0 20px 20px;background:#fff;border-color:var(--border)} .toggle-icon{color:var(--orange);font-weight:400} .topic-toolbar{background:none;border-color:var(--border);margin-bottom:20px} .topic-toolbar p{font-size:12px} .study-filters{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:20px} .study-topic-search{position:relative;flex:1;min-width:200px}.study-topic-search input{width:100%;padding:10px 14px 10px 40px;font-size:12px}.study-topic-search svg{position:absolute;top:13px;left:13px;width:18px;height:18px;fill:none;stroke:var(--muted);stroke-width:1.7} .study-filter-tabs{display:flex;gap:3px;background:#edf2e9;border:1px solid #e0e7d8;padding:4px;border-radius:10px}.study-filter-tabs button{border:0;background:none;min-height:34px;border-radius:7px;padding:7px 12px;color:var(--muted);font-size:11px;font-weight:600;cursor:pointer}.study-filter-tabs button[aria-pressed=true]{background:#fff;color:var(--orange);box-shadow:0 1px 5px #20362f10} .study-empty{grid-column:1/-1;border:1px dashed #bfcfb5;background:#f6f9f2;border-radius:14px;padding:35px 20px;text-align:center}.study-empty strong{color:var(--text);font-size:16px}.study-empty p{font-size:12px;color:var(--muted)} .progress-insight{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,2fr);align-items:center;gap:30px;background:#f1f6eb;border:1px solid #dde8d3;border-radius:17px;padding:25px;margin:24px 0}.progress-insight h2{font-size:21px;letter-spacing:-.6px;margin:3px 0 8px;color:var(--text)}.progress-insight p{font-size:12px;color:var(--muted);line-height:1.7;margin:0}.progress-insight-heading>strong{font-size:33px;font-weight:650;color:var(--orange);display:block;margin-top:12px}.progress-insight-heading>strong small{font-size:11px;font-weight:500;margin-left:4px;color:var(--muted)}.progress-plot{min-width:0}.progress-plot svg{width:100%;display:block;overflow:visible}.plot-grid{stroke:#cfddc4;stroke-width:1;stroke-dasharray:4 5;fill:none}.plot-area{fill:#d7e8c880}.plot-line{stroke:#367851;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round}.plot-point{fill:#fff;stroke:#367851;stroke-width:2}.plot-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;padding:0 10px}.progress-insight.is-empty{grid-template-columns:auto 1fr auto;gap:18px}.progress-insight.is-empty>.ui-icon{width:34px;height:34px;color:var(--orange)} .auth-layout{display:grid;grid-template-columns:1fr 1.05fr;max-width:1040px;margin:24px auto;gap:24px;align-items:stretch}.auth-layout .login-card{width:100%;max-width:none;margin:0;box-shadow:none}.auth-story{position:relative;overflow:hidden;background:#e6eedc;border:1px solid #dae4d0;border-radius:20px;padding:44px 36px;display:flex;flex-direction:column;justify-content:center}.auth-story h2{font-size:41px;line-height:1.14;letter-spacing:-1.7px;margin:18px 0;color:var(--text);position:relative;z-index:1}.auth-story>p{color:#5d7257;font-size:13px;line-height:1.8;max-width:300px}.auth-story::after{content:"";position:absolute;width:270px;height:270px;border:1px solid #96ad811f;border-radius:50%;right:-140px;top:-140px;box-shadow:0 0 0 38px #96ad810a,0 0 0 76px #96ad8108;pointer-events:none}.auth-steps{display:grid;gap:22px;margin:32px 0}.auth-steps>div{display:flex;align-items:center;gap:14px;color:var(--orange)}.auth-steps .ui-icon{width:23px;height:23px}.auth-steps span{font-size:13px;font-weight:650}.auth-steps small{display:block;font-size:11px;color:#63745c;font-weight:400;margin-top:3px}.auth-story-note{font-size:10px;color:#63745c;margin-top:auto;padding-top:30px} .stat-pill,.tag,.review-chip{background:#f2f5ee;color:#576a5d;border:1px solid #dbe4d5;box-shadow:none} .stat-pill-ok,.stat-pill-good,.tag.good{color:#216644;background:#e7f3e8;border-color:#c2dfc7} .stat-pill-bad,.stat-pill-failed,.tag.bad{color:#9c3d40;background:#faeeee;border-color:#eed3d4} .stat-pill-empty{background:#f4f5f2;color:#53634f;border-color:#e2e6dc;opacity:1} .topic-pick{background:#fff;border-color:var(--border);border-radius:12px;padding:15px} .topic-pick.is-on{background:#eff6e9;border-color:#a6c49f} .topic-pick-check{background:#fff;border-color:#b4c4b5;color:var(--orange)} .topic-pick.is-on .topic-pick-check{background:var(--orange);color:#fff;border-color:var(--orange)} .topic-pager{gap:8px} .alert{background:#f4f6ee;border:1px solid #dde5d3;color:#53654a;border-radius:12px;font-size:13px;box-shadow:none;padding:16px 18px} .access-callout,.pending-test-banner{background:#edf5e8;border:1px solid #d4e4c9;border-radius:15px;color:var(--text)} .public-syllabus,.collapsible-block{background:#fff;border-color:var(--border);border-radius:14px} .public-syllabus-heading h2{color:var(--text)} .public-topic-list li{border-color:var(--border);color:var(--text);font-size:13px;padding:14px 0} .public-topic-list li::marker{color:var(--orange);font-weight:600} .topic-readonly-badge{background:#edf3e7;color:var(--orange);border-color:#dae6d2} .test-card{max-width:1040px;margin:0 auto;box-shadow:var(--shadow)} .progress{height:5px;background:#e7ede2;border-radius:8px;overflow:hidden} .progress span{background:var(--orange);border-radius:8px;transition:width .3s ease} .test-meta{font-size:12px;margin:20px 0} .timer{color:var(--orange);background:#edf4e7;border-radius:8px;padding:6px 10px;font-variant-numeric:tabular-nums} .timer-warn{color:#9d3a36;background:#fff0ed} .test-question-map{background:#f5f8f1;border:1px solid #e0e8d9;border-radius:13px;padding:15px;margin:16px 0 28px} .question-map-head strong{color:var(--text);font-size:12px} .question-map-legend{color:var(--muted)} .question-map-item{background:#fff;color:#647467;border:1px solid #d8e1d2;border-radius:7px} .question-map-item.is-current{box-shadow:0 0 0 2px var(--orange);border-color:#fff;color:var(--orange)} .question-map-item.is-answered,.question-map-item.is-pending{background:#e1ece1;color:#356544;border-color:#b7d1b7} .question-map-item.is-correct{background:#d9eddb;color:#23653d;border-color:#a4cfae} .question-map-item.is-incorrect{background:#f6e0e1;color:#943c43;border-color:#e5b8bc} .question h2{color:var(--text);font-size:clamp(19px,2vw,24px);font-weight:600;line-height:1.6;letter-spacing:-.35px;margin:20px 0 25px} .answers{gap:11px;counter-reset:answer-letter} .answer{position:relative;background:#fff;border:1px solid #d6e0d4;border-radius:12px;min-height:64px;padding:16px 18px;box-shadow:none;color:var(--text);gap:13px;counter-increment:answer-letter;transition:background .15s,border-color .15s} .answer::before{content:counter(answer-letter,upper-alpha);display:grid;place-items:center;flex:0 0 28px;height:28px;background:#f4f6f0;border:1px solid #dfe7d9;border-radius:8px;font-size:11px;color:var(--muted)} .answer input{position:absolute;opacity:0;width:1px;height:1px} .answer:has(input:focus-visible){outline:3px solid var(--orange);outline-offset:3px} .answer .answer-copy{font-size:14px;line-height:1.7} .answer:hover{background:#f5f8f1;border-color:#abc4a6;transform:none} .answer.selected{background:#edf5e7;border:2px solid #43835b;padding:15px 17px;color:var(--text)} .answer.correct,.answer.correct.selected{background:#e7f4e7;border-color:#519568;color:#245b34} .answer.incorrect,.answer.selected.incorrect{background:#fcf0f0;border-color:#bd686f;color:#8c343b} .answer.correct::before{background:#d5eace;color:#286542;border-color:#b9d7b1} .answer.incorrect::before{background:#f4dbdd;color:#9c3b45;border-color:#e5bcc0} .answer-state-correct{color:#286542}.answer-state-incorrect{color:#9c3b45} .test-feedback-correct{background:#eaf4e8;border-color:#c6dfbd;color:#2c603b} .test-feedback-incorrect{background:#fcf0f0;border-color:#edcfd1;color:#8c343b} .test-feedback-blank{background:#f4f5ef;border-color:#dde3d4;color:#586650} .test-tools{font-size:11px;border-color:var(--border);gap:10px} .test-navigation{border-color:var(--border);padding-top:20px;margin-top:22px} .test-nav-button{background:#fff;border-color:var(--border);color:var(--text)} .question-difficulty-trigger,.question-difficulty-menu,.question-difficulty-option{background:#fff;border-color:var(--border);color:var(--muted)} .question-difficulty-option.is-selected{background:#edf4e7;color:var(--orange);border-color:#aac69f} .review-chip.answered{background:#e3efdf;border-color:#bad4b2;color:#356447} .review-chip.doubt{background:#fbefdb;border-color:#e8d1a3;color:#8a621f} .result-stat-ok{background:#edf5e7;border-color:#c6dfbd}.result-stat-wrong{background:#fcf0f0;border-color:#edcfd1}.result-stat-blank{background:#f5f5ef;border-color:#e2e3d3} .result-stat-ok strong{color:#286542}.result-stat-wrong strong{color:#a44046} .review-question{background:#fbfcf9;border:1px solid var(--border);border-radius:13px;padding:20px} .review-question.correct{border-left:4px solid #6aa778}.review-question.wrong{border-left:4px solid #c87b7e}.review-question.blank{border-left:4px solid #b9beaa} .review-question h3{font-size:15px;color:var(--text)} .review-question p{font-size:13px;color:var(--muted)} details.progressive-details,details.ux-disclosure{background:#fbfcf9;border:1px solid var(--border);border-radius:13px;box-shadow:none;overflow:hidden} details>summary{color:var(--text);padding:16px;font-size:13px;cursor:pointer;transition:background .15s} details>summary:hover,details[open]>summary{background:#f0f5ea} details[open]>summary{border-bottom:1px solid var(--border)} .ux-summary-copy strong,.collapsible-heading strong{color:var(--text)} .ux-summary-copy small,.collapsible-heading small{color:var(--muted)} .ux-summary-action{color:var(--orange);background:#e8f1df;border-color:#d9e5cb;border-radius:7px} .login-card,.login-panel{max-width:500px;background:#fff;margin:36px auto;padding:36px;border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow-md);position:relative} .login-card::before{content:"";display:block;width:38px;height:5px;background:var(--orange);border-radius:6px;margin-bottom:26px} .login-card .section-title{font-size:30px;letter-spacing:-1px} .login-card>.muted{font-size:13px;margin-bottom:26px;line-height:1.8} .login-card .field{margin-bottom:20px} .login-card .btn-primary{min-height:47px} .login-card .auth-links{border-top:1px solid var(--border);padding-top:18px;margin-top:23px;gap:10px} .login-card .auth-links .btn{font-size:13px;min-height:44px;padding:8px 5px} .password-toggle{color:var(--muted);background:transparent;border:0;box-shadow:none} .consent-box,.terms-prompt,.signup-consent{background:#f5f8f1;color:var(--text);border-color:var(--border)} .legal-consent{color:var(--muted);font-size:12px} .settings-shell,.plans-shell{gap:22px} .settings-header{background:#eaf1e4;border-color:#dce7d3;padding:30px} .settings-header p,.settings-identity-email{color:var(--muted)} .settings-avatar{width:58px;height:58px;border-radius:18px;background:#fff;color:var(--orange);border:1px solid #cedfc4;font-size:23px;box-shadow:none} .settings-card{background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:none;padding:25px} .settings-card h2{color:var(--text);font-size:20px;letter-spacing:-.5px} .settings-card p,.settings-label{color:var(--muted);font-size:12px} .settings-account{background:#fff;border-color:var(--border)} .settings-account strong{color:var(--text)} .settings-account span{color:var(--muted)} .account-delete-warning{background:#fbefee;border:1px solid #eccac8;color:#8f3c3b} .account-delete-warning strong{color:#913a39} .admin-group{background:#fff;border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:none} .admin-group-label{margin:0 0 13px;color:var(--muted)} .profile-menu-row{background:#fff;border-color:var(--border);color:var(--text);border-radius:10px;padding:16px 12px;gap:13px;transition:background .15s} .profile-menu-row:hover{background:#f0f6e9} .profile-menu-row-icon{background:#edf4e7;color:var(--orange);border:0;border-radius:10px;width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center} .profile-menu-row-icon svg{width:20px;height:20px} .profile-menu-row-label{font-size:13px;font-weight:600} .profile-menu-row-chevron{color:#79967e} .profile-menu-row.is-important{background:#edf5e7;border-color:#cadfc0;color:var(--orange)} .profile-menu-row.danger{color:var(--red)} .profile-menu-row.danger .profile-menu-row-icon{background:#faeeee;color:var(--red)} .plans-hero{background:#eaf1e4;border-color:#dce7d3;color:var(--text)} .plans-intro,.plans-lead,.plans-notice{color:var(--muted)} .plan-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:27px;box-shadow:none} .plan-card.featured,.plan-card.is-featured{border:2px solid #468265;background:#f9fcf5} .plan-card h2,.plan-card h3,.plan-price{color:var(--text)} .plan-card p,.plan-card li,.plan-price small{color:var(--muted)} .plan-badge{background:#e8f1df;color:var(--orange);border-color:#d4e3c7} .plan-steps article{background:#f5f8f1;border-color:var(--border);color:var(--text);border-radius:14px} .plan-steps article span{background:#e3eedb;color:var(--orange)} .table-scroll{border:1px solid var(--border);border-radius:13px;background:#fff;overflow:auto} table.users-table{border-collapse:collapse;background:#fff;font-size:13px} .users-table th{background:#f0f5eb;color:#65745e;text-transform:uppercase;font-size:10px;letter-spacing:.7px;font-weight:650;padding:15px} .users-table td{border-color:var(--border);color:var(--text);padding:16px 15px} .users-table tbody tr:nth-child(even){background:#fbfcf8} .users-table tbody tr:hover{background:#f2f7ec} .ranking-table tr.ranking-me{background:#edf5e5} .ranking-you-tag{background:#dceccc;border-color:#c5dcaf;color:var(--orange)} .ranking-table tbody tr:nth-child(-n+3) td:first-child{font-size:20px;font-weight:700;color:var(--orange)} .ranking-privacy-settings{background:#fff;border-color:var(--border);color:var(--text)} .admin-opposition-context,.admin-topic-toolbar,.metrics-toolbar{background:#edf4e7;border:1px solid #d5e3cc;border-radius:13px;color:var(--text)} .admin-topic-item,.user-card,.admin-q-row,.admin-question-editor,.metrics-card{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:none;color:var(--text)} .admin-topic-open{color:var(--text);padding:17px;background:none} .admin-topic-open-number,.admin-q-row-index{background:#edf4e7;color:var(--orange);border-color:#dbe5d3} .admin-topic-open-hint{color:var(--muted)} .admin-topic-search{background:#fff;border:1px solid var(--border);border-radius:10px} .admin-topic-search input{background:none!important;border:0!important;box-shadow:none!important} .admin-q-row.is-open{border-color:#a3c294;background:#f9fcf5} .admin-q-row-summary:hover{background:#f3f8ed} .admin-q-answer{color:var(--muted)} .admin-q-answer-box{background:#f4f6ef;border-color:#dce5d3;color:var(--muted)} .admin-q-answer.is-correct .admin-q-answer-box{background:#dfeeda;color:#2d693b;border-color:#bdd7b4} .admin-q-answer.is-correct{color:#2d693b} .admin-q-row-statement,.admin-topic-title{color:var(--text)} .metric-kpi-grid article,.business-metrics>div{background:#f3f7ee;border-color:#dce7d3} .metric-kpi-grid article.is-warning{background:#fff5e6;border-color:#ebd5b2} .metrics-card h3,.business-metrics span,.metric-route-row code,.metric-route-row span,.metric-status b{color:var(--text)} .metric-route-row,.metric-status{background:#f3f7ef;color:var(--muted)} .metric-status.status-2xx b,.metric-ok{color:#2d7046!important} .metric-status.status-4xx b{color:#89611d}.metric-status.status-5xx b,.metric-bad{color:#ac3c42!important} .metrics-chart{background:repeating-linear-gradient(to top,transparent 0,transparent 32px,#dce5d6 33px);border-color:var(--border)} .metrics-bar{background:linear-gradient(#9bbc78,#317653)} .metrics-footnote{color:var(--muted)} .announcement-card,.announcement-item,.notice-card,.official-update-card,.chat-message,.chat-card,.info-card,.empty-state{background:#fff;border:1px solid var(--border);border-radius:14px;color:var(--text);box-shadow:none} .announcement-card{margin-top:12px;border-left:3px solid #7f9f62}.announcement-title{color:var(--text);font-size:15px}.announcement-meta,.announcement-meta small,.announcement-foot{color:var(--muted)}.announcement-target{color:var(--orange);background:#edf4e7;border-color:#dbe6d3}.announcement-body{background:#fbfcf8;border-color:var(--border);padding:22px}.announcement-text{color:var(--text);font-size:14px;line-height:1.8}.announcement-foot{border-color:var(--border)}.announcement-compose{padding:20px}.announcement-compose textarea{width:100%;padding:13px} .official-agent-card,.official-agent-card.is-active{background:#f0f6e9;border:1px solid #d5e4c8;border-radius:14px;box-shadow:none;margin:24px 0}.official-agent-identity h2{color:var(--text);font-size:16px}.official-agent-status{color:#5a7350}.official-agent-body{color:var(--muted);border-color:#d5e4c8}.official-agent-sources span{color:var(--orange);background:#e4efd9;border-color:#c8ddba}.official-agent-logo{border-radius:11px}.update-item,.update-item-admin{background:#fff;border:1px solid var(--border);border-left:3px solid #a8bd88;border-radius:12px;padding:19px 22px;box-shadow:none}.update-item:hover{background:#f5f9f0;border-color:#aec29e;transform:translateX(2px)}.update-title{color:var(--text);font-size:14px;line-height:1.7}.update-date,.update-dept{background:#eef4e7;color:#627755;border-color:#dce6d1}.update-meta{color:var(--muted);font-size:10px} .topic-performance-row,.analytics-type-card,.attempt-card{background:#fbfcf8;border:1px solid var(--border);border-radius:13px;box-shadow:none;padding:20px}.topic-performance-head strong{color:var(--text);font-size:14px}.topic-performance-meta{color:var(--muted)}.chart-bar{background:#e8eedf;border-radius:6px;height:7px}.bar-ok{background:#659667}.bar-bad{background:#cd8a88}.analytics-score{background:conic-gradient(#4d8a5b calc(var(--score)*1%),#e4ebdc 0);color:var(--text)}.analytics-score::before{background:#fbfcf8}.analytics-score strong{color:var(--text)}.analytics-type-card h3,.attempt-main strong,.attempt-date strong{color:var(--text)}.analytics-type-card p,.attempt-main span,.attempt-date span{color:var(--muted)}.attempt-score.is-good{background:#e6f1df;color:#3c723b}.attempt-score.is-mid{background:#faf0dc;color:#876622}.attempt-score.is-low{background:#faebeb;color:#a04a4c} .admin-opposition-choice{background:#fbfcf8;border:1px solid var(--border);border-radius:15px;color:var(--text);box-shadow:none}.admin-opposition-choice:hover{background:#edf5e5;border-color:#a7c098}.admin-section-link{background:#fbfcf8;border-color:var(--border);border-radius:13px;padding:18px}.admin-section-link:hover{background:#edf5e5}.admin-answer-option,.report-card,.report-question-block,.admin-explanation-context,.admin-editor-section{background:#fbfcf8;border:1px solid var(--border);border-radius:11px;color:var(--text)}.admin-answer-option.is-correct,.admin-answer-option:has(input:checked){background:#edf5e5;border-color:#b5cfa5}.admin-answer-letter,.report-answer-letter,.admin-editor-step{background:#e9f1e1;color:var(--orange);border-color:#cddfc0}.report-card-header,.report-context,.report-user-detail,.report-answer-list,.report-resolution{color:var(--text)}.report-status{background:#edf4e6;color:var(--orange);border-color:#d5e3c9}.admin-explanation-actions,.admin-editor-secondary-actions,.admin-editor-primary-actions{border-color:var(--border)}.admin-explanation-history-item,.explanation-history-card,.explanation-diff-before,.explanation-diff-after{background:#f5f8f0;color:var(--text);border-color:var(--border)} .chat-body,.announcement-body{color:var(--text)} .announcement-compose input,.announcement-compose select,.announcement-compose textarea{background:#fff;color:var(--text);border-color:var(--border)} .danger-disclosure>summary{color:var(--red)} .legal-page{max-width:850px;margin:0 auto;line-height:1.85} .legal-page h2{font-size:19px;letter-spacing:-.3px;padding-top:18px;border-top:1px solid var(--border);margin-top:28px;color:var(--text)} .legal-page h3{font-size:16px;color:var(--text)} .legal-page p,.legal-page li{color:var(--muted);font-size:14px} .legal-page a{color:var(--orange);text-decoration:underline;text-underline-offset:3px} .footer{max-width:var(--content-max);margin:0 auto;padding:22px var(--page-gutter) 30px;border-top:1px solid var(--border);background:none;color:var(--muted);font-size:10px;gap:8px} .footer-links{gap:15px}.footer-links button{color:var(--muted);font-size:10px}.footer-links button:hover{color:var(--orange)} .toast{background:#203e30;color:#fff;border:1px solid #3c5b46;border-radius:12px;box-shadow:var(--shadow-lg);padding:13px 20px;font-size:13px;z-index:2200} .command-dialog{width:min(560px,calc(100vw - 32px));max-height:min(650px,80dvh);border:1px solid #d6e2ce;border-radius:18px;padding:0;background:#fff;color:var(--text);box-shadow:var(--shadow-lg);overflow:hidden} .command-dialog::backdrop{background:#16322655;backdrop-filter:blur(5px)} .command-head{display:flex;align-items:center;gap:10px;padding:17px 20px;border-bottom:1px solid var(--border)} .command-head h2{font-size:16px;margin:0;flex:1;letter-spacing:-.3px} .command-close{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--muted);cursor:pointer} .command-search{padding:16px 20px 8px}.command-search input{width:100%;padding:10px 12px} .command-list{padding:8px 12px 14px;max-height:48dvh;overflow:auto;display:grid;gap:3px} .command-item{display:flex;align-items:center;gap:12px;background:#fff;border:0;border-radius:10px;min-height:55px;padding:10px 13px;color:var(--text);text-align:left;cursor:pointer;width:100%} .command-item:hover,.command-item:focus-visible{background:#edf5e5;outline-offset:-2px} .command-item .ui-icon{color:var(--orange)} .command-item span{flex:1;font-size:13px;font-weight:600}.command-item small{display:block;color:var(--muted);font-size:10px;font-weight:400;margin-top:2px} .command-empty{color:var(--muted);font-size:13px;padding:18px} .command-foot{background:#f5f8f1;border-top:1px solid var(--border);padding:10px 20px;font-size:10px;color:var(--muted)} @keyframes aula-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}} #app.is-route-entering{animation:aula-enter .24s ease-out} @media(hover:hover){.command-trigger:hover{border-color:#a0b998;color:var(--orange)}.header-account:hover{background:#dce9ce}} @media(min-width:1500px){.home-hero-copy{padding:48px}.home-hero-copy .h1{font-size:59px}} @media(max-width:1100px) and (min-width:901px){:root{--side-nav-width:192px;--side-nav-half:96px;--page-gutter:24px}.brand strong{font-size:18px}.brand small{font-size:9px}.brand-icon{width:34px;height:34px}.brand-icon img{width:34px;height:34px}.home-hero-copy{padding:28px}.home-hero-copy .h1{font-size:38px}.workspace-context{font-size:11px}.command-trigger kbd{display:none}.offer-panel{gap:22px;padding:24px}.study-card{padding:18px}} @media(max-width:900px){ .topbar,body.has-bottom-nav .topbar{flex-direction:row;align-items:center} .topbar,body.has-bottom-nav .topbar{padding:12px 22px;height:74px;min-height:74px}.workspace-context{display:none}.brand strong{font-size:19px}.brand small{font-size:9px}.brand-icon{width:37px;height:37px}.brand-icon img{width:35px;height:35px} .command-trigger{width:36px;height:36px;padding:8px;justify-content:center}.command-trigger span,.command-trigger kbd{display:none}.header-actions{gap:8px} main#app{padding-top:25px}.bottom-nav{padding-top:10px}.bottom-nav-label{font-size:10px}.bottom-nav-item{gap:4px}.bottom-nav-item-center{flex-basis:70px}.bottom-nav-item-center .bottom-nav-label{margin-top:2px}.bottom-nav-item.active:not(.bottom-nav-item-center)::before{top:-4px} .home-hero-copy{padding:30px}.home-hero-copy .h1{font-size:clamp(35px,5vw,45px)}.home-hero{gap:20px}.offer-panel{gap:22px}.panel{padding:24px}.study-card{padding:20px}.login-card{padding:30px;margin:24px auto} .footer{padding-bottom:28px}.header-account{width:36px;height:36px} } @media(max-width:680px){ .auth-layout{grid-template-columns:1fr;margin:4px auto;gap:16px}.auth-story{padding:25px}.auth-story h2{font-size:30px;letter-spacing:-1px;margin:8px 0}.auth-story>p{font-size:12px;margin:5px 0;max-width:none}.auth-steps,.auth-story-note{display:none}.auth-story .kicker{font-size:9px;margin:0}.auth-layout .login-card{margin:0;padding:25px 22px} .study-filters{gap:10px}.study-topic-search{flex-basis:100%}.study-filter-tabs{width:100%}.study-filter-tabs button{flex:1;padding:7px;font-size:10px}.progress-insight{grid-template-columns:1fr;padding:20px;gap:10px}.progress-insight.is-empty{grid-template-columns:auto 1fr}.progress-insight.is-empty .btn{grid-column:1/-1;justify-self:start}.progress-insight h2{font-size:19px}.progress-insight-heading>strong{font-size:27px}.topic-performance-row,.analytics-type-card,.attempt-card{padding:16px}.update-item{padding:16px}.announcement-title{font-size:13px}.official-agent-identity h2{font-size:14px} :root{--page-gutter:18px}.topbar,body.has-bottom-nav .topbar{padding:12px 18px;gap:8px} main#app{padding-top:20px;padding-bottom:32px}.home-shell{gap:20px}.home-hero,.home-hero.is-authenticated{grid-template-columns:1fr;gap:18px}.home-hero-copy{padding:28px 25px}.home-hero-copy .h1{font-size:43px;letter-spacing:-1.8px;max-width:420px}.home-hero-copy .lead{font-size:13px}.home-hero-copy .cta-row{margin-top:22px}.home-hero-copy .btn{padding:11px 16px}.hero-chip-row{gap:3px;margin-top:19px}.hero-chip{font-size:9px}.hero-chip+.hero-chip{margin-left:6px}.hero-claim{font-size:10px}.hero-carousel-panel{padding:20px} .offer-panel{grid-template-columns:1fr;padding:23px;gap:19px}.offer-intro .section-title{font-size:26px}.demo-card{padding:17px}.offer-intro .muted{font-size:12px}.home-oppositions{grid-template-columns:1fr;margin-top:20px}.opposition-card.available.opposition-card-compact{padding:21px;min-height:160px}.opposition-card-compact h3{font-size:18px} .panel,.test-card{padding:22px 19px;border-radius:17px}.section-title{font-size:27px}.kicker{font-size:9px;letter-spacing:1.4px}.lead{font-size:13px}.study-card-grid{grid-template-columns:1fr;gap:11px}.study-card{padding:20px 17px;min-height:122px;gap:13px;border-radius:14px}.study-card-copy strong{font-size:16px}.study-card-copy small{font-size:12px}.study-card-icon{width:40px;height:40px;border-radius:11px}.study-card-meta{font-size:10px;margin-top:5px}.opp-group-title{font-size:19px} .study-screen-head{grid-template-columns:minmax(0,1fr) auto;padding-bottom:20px;margin-bottom:20px;gap:14px}.study-screen-head>.back-button{grid-column:1/-1;min-height:28px;max-width:100%;font-size:10px}.study-screen-title h1{font-size:25px;letter-spacing:-.8px}.study-screen-title .muted{font-size:12px}.study-screen-count{padding:12px;min-width:60px}.study-screen-count strong{font-size:25px}.study-screen-count span{font-size:9px} .stats,.mini-stats{gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))!important;margin:18px 0}.stat{display:block;padding:16px 13px}.stat strong{font-size:25px;text-align:left}.stat span{font-size:10px} .topic-header{padding:15px 12px;gap:10px;flex-wrap:wrap}.topic-heading{flex:1;min-width:0}.topic-heading h3{font-size:13px}.topic-index{width:29px;height:29px;border-radius:8px}.topic-side-stats{flex-basis:100%;padding-left:39px;order:4}.topic-header .toggle-icon{margin-left:auto}.topic-config{padding:0 14px 17px}.topic-toolbar{display:grid;gap:9px}.topic-toolbar p{font-size:11px} .quick-start-grid{grid-template-columns:1fr}.quick-start-card{padding:22px;min-height:110px}.simulator-action{padding:15px}.simulator-action-copy strong{font-size:13px}.simulator-action-copy small{font-size:11px}.topic-pick{padding:13px}.topic-pick-copy strong{font-size:12px} .test-card{padding:20px 16px}.question h2{font-size:18px;line-height:1.6;margin:20px 0}.answer{padding:13px 12px;gap:10px;min-height:61px}.answer.selected{padding:12px 11px}.answer::before{flex-basis:25px;height:25px;font-size:10px}.answer .answer-copy{font-size:13px}.test-question-map{padding:12px;margin-bottom:20px}.test-meta{font-size:11px;flex-wrap:wrap;gap:5px}.question-map-item{border-radius:6px}.test-tools{font-size:10px}.test-navigation .btn{padding:10px 12px;font-size:12px}.review-question{padding:16px} .login-card,.login-panel{margin:14px auto;padding:28px 22px}.login-card .section-title{font-size:28px}.login-card>.muted{font-size:12px}.settings-header{padding:24px 20px}.settings-card{padding:22px}.settings-card h2{font-size:18px}.admin-group{padding:16px}.profile-menu-row{padding:14px 8px}.profile-menu-row-label{font-size:12px}.settings-grid{grid-template-columns:1fr}.users-table td{padding:13px 10px}.users-table th{padding:13px 10px} .legal-page p,.legal-page li{font-size:13px}.footer{font-size:9px}.footer-links{gap:12px}.footer-links button{font-size:10px;min-height:30px}.community-pulse-title{font-size:21px} } @media(max-width:370px){.brand small{display:none}.home-hero-copy .h1{font-size:37px}.home-hero-copy{padding:25px 21px}.hero-chip{font-size:9px}.hero-chip+.hero-chip{margin-left:0}.home-hero-copy .btn{padding:10px 12px;font-size:12px}.panel{padding:20px 15px}} /* Shared controls retain generous hit areas even in dense study screens. */ .btn-small,.demo-reset,.study-filter-tabs button,.footer-links button{min-height:44px} .study-screen-head>.back-button{min-height:44px;font-size:12px;padding:6px 10px;margin-left:-10px} .password-toggle{width:44px;height:44px;right:2px} .question-map-grid{grid-template-columns:repeat(auto-fit,44px);max-width:calc(var(--question-map-columns)*50px);gap:6px;padding:5px} .question-map-item{width:44px;height:44px;font-size:13px} .question-map-item.is-current{outline:2px solid var(--orange);outline-offset:1px;box-shadow:none} .question-difficulty-trigger,.question-difficulty-option{min-height:44px} .test-tools .review-chip{min-height:44px;padding:8px 12px;font-size:12px} .test-nav-button .ui-icon{width:20px;height:20px} .test-nav-previous .ui-icon{transform:rotate(180deg)} .compact-topic-grid .topic-card{padding:0} .compact-topic-grid .topic-header{display:grid;grid-template-columns:32px minmax(0,1fr) auto 24px;gap:12px;padding:18px;text-align:left} .compact-topic-grid .topic-heading{min-width:0} .compact-topic-grid .topic-card h3{display:block;overflow:visible;-webkit-line-clamp:unset;font-size:15px;line-height:1.5;word-break:normal;overflow-wrap:break-word} .compact-topic-grid .topic-heading small{display:block;margin-top:5px;white-space:nowrap;font-size:12px} .compact-topic-grid .topic-side-stats{display:flex;flex-direction:row;flex-wrap:wrap;gap:6px;padding:0} .compact-topic-grid .topic-header .toggle-icon{width:24px;justify-self:end;margin:0;text-align:center} @media(max-width:900px){ :root{--bottom-nav-height:84px} html{scroll-padding-bottom:calc(var(--bottom-nav-height) + env(safe-area-inset-bottom,0px) + 16px)} .topbar>.brand{width:auto;flex:1 1 auto;min-width:0} .brand>div{min-width:0}.brand strong{white-space:nowrap} .header-actions{flex:0 0 auto;gap:8px} .command-trigger,.header-account{width:44px;height:44px;flex:0 0 44px;padding:0} .topbar .ui-icon{width:21px;height:21px} .bottom-nav{padding-top:6px;align-items:center} .bottom-nav-side{align-items:center} .bottom-nav-item{min-height:66px;justify-content:center;gap:4px;padding:4px 2px} .bottom-nav-item .bottom-nav-icon,.bottom-nav-item .bottom-nav-icon-circle{width:40px;height:40px;margin:0;flex:0 0 40px;display:grid;place-items:center} .bottom-nav-icon-circle{border:0;border-radius:13px;box-shadow:none} .bottom-nav-item-center:is(:hover,:active) .bottom-nav-icon-circle{background:var(--orange-dark);box-shadow:none} .bottom-nav-icon svg,.bottom-nav-icon-circle svg{width:23px;height:23px} .bottom-nav-label{font-size:10px;line-height:14px;white-space:nowrap} .bottom-nav-item-center .bottom-nav-label{margin:0} .bottom-nav-item.active:not(.bottom-nav-item-center)::before{top:1px} .study-filter-tabs button{font-size:12px} .compact-topic-grid .topic-header{grid-template-columns:30px minmax(0,1fr) 24px;gap:9px 10px;padding:15px 12px} .compact-topic-grid .topic-card h3{font-size:14px} .compact-topic-grid .topic-side-stats{grid-column:2;grid-row:2;justify-content:flex-start;order:initial} .compact-topic-grid .topic-header .toggle-icon{grid-column:3;grid-row:1} .admin-section-link{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:14px;text-align:left} .admin-section-link .collapsible-title-main{display:grid;grid-template-columns:36px minmax(0,1fr);gap:10px;width:100%} .admin-section-link .collapsible-icon{width:36px;height:36px} .admin-section-link .collapsible-heading strong{font-size:14px;line-height:1.45;overflow-wrap:normal} .admin-section-link .collapsible-heading small{font-size:12px;line-height:1.5;overflow-wrap:normal} .admin-section-link .collapsible-title-aside{padding-left:46px;justify-content:space-between;gap:8px} .admin-section-link .stat-pill{font-size:12px;line-height:1.5;padding:4px 8px} .profile-menu-row-label{font-size:14px} input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{font-size:16px} .test-tools{gap:8px}.test-tools .btn{font-size:12px;min-height:44px} .question .answer-copy{font-size:15px;line-height:1.65} .footer-links{gap:4px 12px;flex-wrap:wrap;justify-content:center} .footer-links button{font-size:12px;padding:8px 4px} } @media(max-width:370px){.brand strong{font-size:17px}.topbar .brand-icon{width:32px;height:32px}.topbar .brand-icon img{width:30px;height:30px}.header-actions{gap:6px}.bottom-nav-label{font-size:9.5px}} @media(max-width:680px){ .home-oppositions .opposition-card-compact h3{font-size:18px;line-height:1.35} .opposition-card-compact .opposition-card-heading{padding-right:0;gap:12px} .opposition-card-compact::after{top:auto;bottom:20px} .home-oppositions .opposition-card-compact .opposition-card-meta{padding-right:38px;gap:6px} .opposition-card-compact .opposition-card-subtitle{font-weight:400;font-size:12px;line-height:1.65} } @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}} @media(min-width:901px) and (max-height:780px){.nav-note{display:none}body.has-bottom-nav #bottomNav{padding-top:104px;gap:4px}.bottom-nav-item,.bottom-nav-side>.bottom-nav-item,.nav-extra-item{min-height:44px;padding-top:10px;padding-bottom:10px}.nav-extra{margin-top:14px;padding-top:14px}} @media print{body.has-bottom-nav{padding:0}.topbar,#bottomNav,.footer,.skip-link,.header-actions{display:none!important}main#app{padding:0;max-width:none}.panel,.test-card{box-shadow:none;border-color:#ccc;break-inside:avoid}} /* ========================================================== v151 · Test en curso: superficie clara y jerarquía de botones ---------------------------------------------------------- El sistema visual Aula tradujo a claro todo lo del test (mapa de preguntas, respuestas, avisos...) menos la propia tarjeta .question, que se quedaba con el degradado azul oscuro de styles.css. Resultado: el enunciado (color var(--text), verde oscuro) sobre fondo casi negro, el marcador ilegible y "Anterior" convertido en un bloque gris (un botón blanco al 38% de opacidad sobre fondo oscuro). Aquí se completa esa traducción y se ordena la jerarquía de los botones: primario = Verificar/Siguiente, secundario = navegación, terciario = reportar y salir. ========================================================== */ .question{background:#fbfcf8;border:1px solid var(--border);border-radius:16px;padding:clamp(18px,2vw,26px);box-shadow:none;color:var(--text)} .question h2{margin:4px 0 22px} .blank-answer{background:#f5f6f0;border:1px dashed #c9d3c4;color:var(--muted)} .test-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--border);padding-top:16px;margin:20px 0 0;font-size:12px} .test-scoreboard{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0} .test-score-pill{display:inline-flex;align-items:baseline;gap:5px;padding:5px 11px;border-radius:999px;border:1px solid;font-size:11px;font-weight:600;letter-spacing:.2px;white-space:nowrap} .test-score-pill strong{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums} .test-score-pill.is-ok{background:#eaf4e6;border-color:#c3dcb9;color:#2c6039} .test-score-pill.is-bad{background:#fcf0f0;border-color:#eccdd0;color:#8c343b} .test-score-pill.is-blank{background:#f4f5ef;border-color:#dee3d5;color:#5a6a5c} .test-score-note{font-size:11px;color:var(--muted)} .test-doubt-button{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;border:1px solid #dbe3d4;border-radius:999px;background:#fff;color:var(--muted);font-size:12px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease} .test-doubt-button .ui-icon{width:17px;height:17px} .test-doubt-button:hover{background:#f5f8f1;border-color:#b6c9ae;color:var(--text)} .test-doubt-button.is-active{background:#fbefdb;border-color:#e3c78f;color:#8a621f} .test-doubt-button.is-active:hover{background:#f7e6c8;border-color:#d9b874} .test-navigation{border-top:1px solid var(--border);padding-top:20px;margin-top:22px} .test-nav-button{background:#fff;border:1px solid #ccd9d0;color:var(--text)} .test-nav-button:hover:not(:disabled){background:#edf4ed;border-color:#8eaf9c;color:var(--orange)} /* Un botón deshabilitado debe leerse como "aquí no hay nada", no como un bloque roto: se apaga con color propio en vez de bajando la opacidad. */ .test-nav-button:disabled{opacity:1;background:#f4f6f0;border-color:#e4eae0;color:#9aa89d} .question .test-footer{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;margin-top:14px} .test-report-button,.test-exit-button{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-weight:600} .test-report-button .ui-icon{width:16px;height:16px} .test-report-button:hover{background:#fdf1f0;color:#8c343b} .test-exit-button:hover{background:#edf4ed;color:var(--orange)} /* Mismo orden de lectura en los dos anchos: enunciado, respuestas, la corrección de lo que acabas de hacer, el botón que continúa, y solo después el marcador y las salidas. Antes el marcador se colaba entre las respuestas y la corrección en escritorio, y en móvil caía por debajo de "Guardar y salir". */ .question{display:flex;flex-direction:column} .question h2{order:0} .question .answers{order:1} .question .alert{order:2} .question .test-navigation{order:3} .question .test-tools{order:4} .question .test-footer{order:5} @media(max-width:900px){ .question .test-footer{justify-content:center} .test-scoreboard{width:100%;justify-content:space-between} .test-score-pill{flex:1;justify-content:center;padding:6px 8px} .test-doubt-button{width:100%;justify-content:center;min-height:44px} } @media(max-width:420px){ .test-score-pill{font-size:10px;gap:4px} .test-score-pill strong{font-size:13px} } /* ========================================================== v151 · Rendimiento personal: tarjetas de lectura rápida ---------------------------------------------------------- Tres cifras que sí llevan a una decisión (vas mejor o peor, cuántos días llevas, qué tema arrastras), en vez de solo totales acumulados. ========================================================== */ .stat-pill-pending{background:#fbf1de;color:#8a621f;border:1px solid #e8d4a6} .stat-pill-exam{background:#e9eff8;color:#2d5480;border:1px solid #c9d8ea} .perf-empty{display:grid;gap:6px} .perf-empty strong{color:var(--text)} .perf-highlights{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:4px 0 18px} .perf-card{display:flex;flex-direction:column;gap:4px;padding:18px;background:#fbfcf8;border:1px solid var(--border);border-left:3px solid #c9d5c4;border-radius:14px} .perf-card-label{font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)} .perf-card-value{display:flex;align-items:center;gap:7px;font-size:30px;line-height:1.1;font-weight:700;letter-spacing:-1px;color:var(--text);font-variant-numeric:tabular-nums} .perf-arrow{font-size:20px;line-height:1} .perf-card-note{font-size:12px;line-height:1.5;color:var(--muted)} .perf-card .btn{align-self:flex-start;margin-top:8px} .perf-card-up{border-left-color:#4d8a5b;background:#f2f8ef} .perf-card-up .perf-arrow{color:#3d7a4e} .perf-card-down{border-left-color:#c07b7f;background:#fdf4f4} .perf-card-down .perf-arrow{color:#a04a4c} .perf-card-flat,.perf-card-neutral{border-left-color:#b9c4b2} .perf-card-flat .perf-arrow,.perf-card-neutral .perf-arrow{color:var(--muted)} .perf-card-streak{border-left-color:var(--orange);background:#f1f7ef} .perf-card-weak{border-left-color:#d9a04e;background:#fdf8ef} /* ========================================================== v151 · Historial y desglose ---------------------------------------------------------- Anillo de acierto compartido, filtros por tipo, agrupación por día y una tarjeta por intento que dice qué test fue y de qué temas. ========================================================== */ .score-ring{--score:0;display:grid;place-items:center;width:58px;height:58px;flex:0 0 auto;border-radius:50%;position:relative;background:conic-gradient(currentColor calc(var(--score)*1%),#e4ebdc 0)} .score-ring::before{content:"";position:absolute;inset:5px;border-radius:50%;background:#fbfcf8} .score-ring strong{position:relative;font-size:13px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums} .score-ring-small{width:48px;height:48px} .score-ring-small::before{inset:4px} .score-ring-small strong{font-size:12px} .score-ring.is-good{color:#4d8a5b} .score-ring.is-mid{color:#c99a3e} .score-ring.is-low{color:#bd686f} .analytics-type-card{display:flex;align-items:center;gap:14px} .analytics-type-card h3{font-size:14px;margin:0 0 3px;color:var(--text)} .analytics-type-card p{margin:0;font-size:12px;color:var(--muted)} .analytics-type-time{margin-top:2px!important;font-size:11px!important} .history-filters{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 14px} .history-filter{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:8px 14px;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--muted);font-size:12px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease} .history-filter span{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#eef2ea;font-size:10px;font-weight:700} .history-filter:hover{background:#f3f7f0;border-color:#b6c9ae;color:var(--text)} .history-filter.is-active{background:var(--orange);border-color:var(--orange);color:#fff} .history-filter.is-active span{background:#ffffff2e;color:#fff} .history-legend{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px;font-size:11px;color:var(--muted)} .history-legend span{display:inline-flex;align-items:center;gap:6px} .history-dot{width:9px;height:9px;border-radius:50%;display:inline-block} .history-dot.is-good{background:#4d8a5b} .history-dot.is-mid{background:#c99a3e} .history-dot.is-low{background:#bd686f} .history-day{margin-bottom:22px} .history-day-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;padding-bottom:8px;margin-bottom:10px;border-bottom:1px solid var(--border)} .history-day-head h3{margin:0;font-size:13px;font-weight:700;color:var(--text)} .history-day-head span{font-size:11px} .history-list{display:grid;gap:10px} .history-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:16px 18px;background:#fbfcf8;border:1px solid var(--border);border-left:3px solid #c9d5c4;border-radius:13px} .history-card-icon{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:12px;background:#eef3ea;color:var(--orange)} .history-card-icon svg{width:20px;height:20px} .history-card-topic{border-left-color:var(--orange)} .history-card-exam{border-left-color:#4a7bab} .history-card-exam .history-card-icon{background:#e9eff8;color:#2d5480} .history-card-review{border-left-color:#c07b7f} .history-card-review .history-card-icon{background:#fbeeee;color:#96474c} .history-card-search{border-left-color:#a99a63} .history-card-search .history-card-icon{background:#f6f3e6;color:#7d6f3c} .history-card-body{min-width:0} .history-card-heading{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap} .history-card-heading strong{font-size:14px;color:var(--text);line-height:1.4} .history-card-kind{font-size:10px;font-weight:700;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted)} .history-card-scope{margin:4px 0 0;font-size:12px;line-height:1.5;color:var(--muted)} .history-card-meta{display:flex;gap:5px 14px;flex-wrap:wrap;margin-top:7px;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums} .history-card-meta b{color:var(--text);font-weight:700} .history-card-meta .is-bad{color:#9c3d40} .history-card-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px} .history-card-aside{display:flex;flex-direction:column;align-items:center;gap:6px} .history-repeat{white-space:nowrap;font-size:11px} .score-ring::before{background:#fbfcf8} @media(max-width:640px){ .perf-highlights{grid-template-columns:1fr;gap:10px} .perf-card{padding:15px 16px} .perf-card-value{font-size:26px} .history-card{grid-template-columns:auto minmax(0,1fr);gap:12px;padding:14px} /* El anillo y "Repetir" pasan a una tercera fila a lo ancho: con tres columnas en 390px el nombre del test se partía letra a letra. */ .history-card-aside{grid-column:1/-1;flex-direction:row;justify-content:space-between;width:100%;border-top:1px solid var(--border);padding-top:12px} .history-day-head{align-items:flex-start;flex-direction:column;gap:3px} .history-filters{gap:6px} .history-filter{flex:1 1 auto;justify-content:center;min-height:40px;padding:8px 11px} .analytics-type-card{gap:12px} } /* ========================================================== v151 · Gestión de usuarios: colores y jerarquía de botones ---------------------------------------------------------- Tres cosas heredadas del tema oscuro que el sistema Aula no había traducido y que dejaban la pantalla inservible: · el desplegable de "Conceder acceso" se pintaba sobre #0b1220 (azul casi negro) con texto oscuro: el nombre de la oposición no se leía en absoluto; · .presence-badge usaba texto verde/gris claro pensado para fondo oscuro ("Activo ahora" en verde pálido sobre verde pálido); · las cuatro acciones de la tarjeta tenían el mismo peso visual, con "Eliminar usuario" indistinguible de "Hacer administrador". ========================================================== */ .user-card-grant{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:7px 8px} /* La etiqueta ocupa su propia fila: con label+select+botón en línea, el nombre de la oposición se cortaba a la mitad dentro del desplegable. */ .user-card-grant-label{grid-column:1/-1;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)} .user-card-grant select{min-width:0;background:#fbfcfa;border:1px solid #cbd8ce;border-radius:10px;color:var(--text);min-height:40px;padding:8px 10px} .user-card-grant select:focus{border-color:#31836a;box-shadow:0 0 0 3px #31836a15;outline:none} .presence-badge{font-size:11px;font-weight:700;letter-spacing:.2px} .presence-badge.online{background:#e4f2e2;color:#2b6039;border:1px solid #bbd9b4} .presence-badge.online::before{content:"";width:7px;height:7px;margin-right:6px;border-radius:50%;background:#3d7a4e} .presence-badge.offline{background:#f3f5f0;color:#5d6b5f;border:1px solid var(--border)} .user-card{gap:13px;padding:18px} .user-card-avatar{background:#e7efdf;border:1px solid #c6d9cc;color:var(--orange)} .user-card-meta{gap:10px 18px} .user-card-meta-wide{grid-column:1/-1} .user-card-meta-item strong{color:var(--text)} .user-card-stats-toggle{align-self:flex-start} .chip-removable{background:#f1f6ee;border-color:#cddcc7;color:var(--text)} .chip-removable:hover{background:#fbeceb;border-color:#dbb2b3;color:#8c343b} .user-card-actions{gap:12px;padding-top:13px;border-top:1px solid var(--border)} .user-card-toggles{gap:7px} .user-card-danger{display:flex;justify-content:flex-start;padding-top:10px;border-top:1px dashed var(--border)} .btn-danger{background:#fff;border:1px solid #e0bdbe;color:#9c3d40} .btn-danger:hover{background:#fbeceb;border-color:#c98e90;color:#7d2d31} /* Solicitud sin resolver: lo único de la tarjeta que exige una decisión. */ .user-card.is-pending{border-color:#d8c28a;box-shadow:0 0 0 1px #e6d3a52e} .user-card-request{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:13px 15px;background:#fdf8ee;border:1px solid #e6d3a5;border-radius:12px} .user-card-request .kicker{margin-bottom:3px;color:#8a621f} .user-card-request strong{display:block;font-size:13px;line-height:1.45;color:var(--text)} .admin-pending-notice{background:#fdf8ee;border:1px solid #e6d3a5;color:var(--text)} .admin-pending-notice strong{color:#8a621f} @media(max-width:640px){ .user-card-meta{grid-template-columns:1fr} .user-card-grant{grid-template-columns:1fr} .user-card-grant .btn,.user-card-toggles .btn,.user-card-danger .btn{width:100%;min-height:44px} .user-card-toggles{flex-direction:column} .user-card-request{flex-direction:column;align-items:stretch} .user-card-request .btn{width:100%;min-height:44px} } /* ========================================================== v151 · Acceso en móvil: que el formulario quepa en pantalla ---------------------------------------------------------- En un móvil de 390x844 el reclamo "Hoy practicas. Mañana avanzas." ocupaba ~210 px por encima de la tarjeta: el botón "Iniciar sesión" caía justo en el filo de la pantalla y "Crear una cuenta" quedaba por debajo, así que había que desplazarse para hacer lo único que se puede hacer en esa pantalla. El reclamo se queda (es la presentación de la marca) pero como banda compacta de dos líneas, no como panel. ========================================================== */ @media(max-width:680px){ .auth-layout{gap:12px;margin:0 auto} .auth-story{padding:16px 18px;border-radius:15px} .auth-story h2{font-size:21px;letter-spacing:-.7px;margin:2px 0 0;line-height:1.25} .auth-story>p{display:none} .auth-story::after{display:none} .auth-layout .login-card{padding:22px 18px;border-radius:17px} .login-card,.login-panel{margin:0 auto} .login-card::before{margin-bottom:16px} .login-card .section-title{font-size:25px} .login-card>.muted{font-size:12.5px;margin-bottom:18px;line-height:1.6} .login-card .field{margin-bottom:14px} /* Enlaces apilados y a todo el ancho: uno al lado del otro quedaban pegados a los bordes de la tarjeta y por debajo del objetivo táctil. */ .login-card .auth-links{flex-direction:column;align-items:stretch;gap:2px;padding-top:14px;margin-top:16px} .login-card .auth-links .btn{width:100%;min-height:44px;padding:10px 8px} .auth-help{margin-top:12px} } /* ========================================================== v151 · Elección de oposición en el alta ---------------------------------------------------------- Tarjetas de radio en vez de un