/* Roman visual system, based on the owner's September 14 references. */
:root{--roman-gold:#e5c272;--roman-cream:#fff1d9;--roman-red:#750e12;--accent:#8c171d;--accent-soft:#8c171d18;--roman-font:Georgia,'Times New Roman',serif}
html[data-theme="dark"]{--accent:#e0b869;--accent-soft:#e0b86920;--bg:#200b0d;--panel:#330e13;--line:#98623555;--text:#fff1d9;--muted:#d0b5a0;--glass-strong:#330e13f2;--glass-line:#98623566}
body{background:#eaf1f5;color:var(--text)}
html[data-theme="dark"] body{background:#1d080b}
#app-shell{display:block!important;grid-template-columns:none!important}
#sidebar,.sidebar-backdrop,.topbar{display:none!important}
.main-area{margin-left:0!important;width:100%}
.view-root{width:100%;max-width:1500px;padding:34px clamp(16px,4.2vw,64px) 42px}
h1,h2,h3,.stage-heading,.btn,.stage-chip,.onboarding-language-copy strong{font-family:var(--roman-font);letter-spacing:.01em}
.roman-gold{color:var(--roman-gold)}
.romancemax-hero{min-height:535px;padding:54px 11% 32px;border-radius:18px;gap:20px;background:#430506 url('assets/images/roman-imperium.png') center/cover;border:1px solid #98552566;box-shadow:0 22px 45px #32151925;overflow:visible}
.romancemax-hero::before,.romancemax-hero::after{display:none!important}
.roman-hero-brand{gap:18px}
.roman-hero-brand h1{position:relative;display:block!important;font-family:var(--roman-font);font-weight:400;font-variant:small-caps;font-size:clamp(40px,6.3vw,86px);letter-spacing:-.035em;line-height:1.2;padding:3px 0 42px;white-space:nowrap}
.roman-hero-brand h1>.spqr-logo{position:absolute;left:50%;top:-24px;transform:translateX(-50%);width:180px;height:180px;z-index:-1;opacity:.9}
.roman-hero-brand .spqr-logo text{transform:translateY(39px);font-size:14px;letter-spacing:2px}
.roman-hero-brand p{font-family:var(--roman-font);font-size:clamp(16px,1.65vw,21px);max-width:940px;color:#eddbc4;line-height:1.4}
.maxxing-legend{gap:14px;max-width:860px}
.maxxing-legend>div{display:grid;grid-template-columns:1fr;text-align:center;gap:9px}
.maxxing-legend>div>span{color:#debdac;font:600 10px/1.3 system-ui;letter-spacing:.3em}
.maxxing-legend>div>div{gap:12px}
.maxxing-legend .profile-language-chip{min-width:136px;min-height:40px;justify-content:center;padding:7px 16px;border:1px solid #ac42347a;background:linear-gradient(#78170c80,#590b0980);box-shadow:inset 0 1px 1px #ffb4631a;opacity:1;filter:none;backdrop-filter:none}
.maxxing-legend .profile-language-chip b{font-weight:400;font-size:13px}
.profile-language-chip .flag-frame{width:28px;height:19px;min-width:28px;border-radius:3px;box-shadow:none}
.romancemax-hero .hero-actions{margin:0;gap:18px}
.roman-primary,.roman-secondary{min-width:215px;min-height:54px;border-radius:10px;font:700 17px/1.2 system-ui;text-transform:uppercase}
.roman-primary{background:#fffaf2;color:#661013;border:1px solid #ddd1bc}
.roman-secondary{background:#53080899;color:#fff1dd;border:1px solid #a13928}
.roman-primary>span,.roman-secondary>span{color:#c69742;font:30px/1 var(--roman-font);margin-right:10px}
.roman-settings-button{position:absolute;right:20px;top:18px;z-index:4;border:1px solid #bd914a99;border-radius:50%;width:42px;height:42px;color:#e8c47a;background:#360908b8;font:29px/1 var(--roman-font);cursor:pointer;box-shadow:inset 0 0 0 3px #d9ab4415}
.roman-home{border:0;background:transparent;color:var(--accent);font:17px var(--roman-font);cursor:pointer;margin:0 0 18px;padding:6px 0}
.dashboard-core-stats{max-width:1040px;margin:20px auto 0;gap:24px}
.course-progress-card,.next-lesson-card{min-height:132px;border-radius:18px;padding:23px 28px;background:#ffffffd9;box-shadow:0 16px 40px #3841560c}
html[data-theme="dark"] :is(.course-progress-card,.next-lesson-card){background:#330e13}
.course-progress-line i{background:linear-gradient(90deg,#681217,#c29b52)}
.onboarding-layer{padding:30px 0;background:#390509 url('assets/images/roman-imperium.png') center/cover fixed;backdrop-filter:none;align-items:flex-start;overflow:auto}
.onboarding-window,html[data-theme="dark"] .onboarding-window{background:transparent;border:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;width:min(1210px,90%);max-height:none;overflow:visible;padding:0;border-radius:0;color:#ffeed6;margin:auto}
.onboarding-brand{display:flex;flex-direction:column;gap:0;align-items:center;justify-content:center;padding:0 0 30px}
.onboarding-brand .spqr-logo{width:106px;height:106px;margin:0;animation:roman-glow 4s ease-in-out infinite}
.onboarding-wordmark strong{font:400 clamp(36px,4.8vw,63px)/1.12 var(--roman-font);font-variant:small-caps;letter-spacing:-.02em}
.onboarding-body{padding:30px 5% 0;background:linear-gradient(135deg,#690d10d9,#290405e8);border:1px solid #c99751;border-bottom:none;box-shadow:inset 0 0 0 5px #e3b86910;border-radius:16px 16px 0 0}
.onboarding-copy{margin:0 0 25px;padding:0;text-align:left}
.onboarding-copy h1{color:#fff0d9;font:400 clamp(25px,3vw,38px)/1.18 var(--roman-font);margin:0 0 8px}
.onboarding-copy p{color:#d9bbaa;font-size:13px;line-height:1.55;max-width:900px;margin:0}
.onboarding-language-grid,.onboarding-language-grid.native-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0}
.onboarding-language-card{position:relative;min-height:100px;display:flex;align-items:center;justify-content:flex-start;gap:20px;padding:18px;border:1px solid #a64030!important;border-radius:12px;background:linear-gradient(130deg,#6c1716,#410708);color:#fff2da;box-shadow:inset 0 1px 1px #e7b87133;overflow:hidden;text-align:left}
.onboarding-language-card::after{content:'';position:absolute;width:120px;height:100%;right:0;top:0;pointer-events:none;background:linear-gradient(90deg,#59090c66,#400405bb),url('assets/images/roman-imperium.png') right/cover;opacity:.4}
.onboarding-language-copy,.onboarding-language-card .flag-frame{position:relative;z-index:1}
.onboarding-language-copy strong{font-size:21px;font-weight:400;color:inherit}
.onboarding-language-card .flag-frame.lg{width:51px;height:51px;min-width:51px;border:2px solid #e1bd6d;border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px #270404,0 5px 8px #0008}
.onboarding-language-card .flag-frame svg{width:100%;height:100%;object-fit:cover;transform:scale(1.5)}
.onboarding-language-card.selected{border:2px solid #e7c071!important;box-shadow:0 0 15px #efa3404d,inset 0 0 15px #cf852526;background:linear-gradient(130deg,#77221b,#4a0c09)}
.onboarding-check{position:absolute;right:10px;top:9px;z-index:2;width:21px;height:21px;background:transparent;color:#f5d580;border:0}
.selected .onboarding-check{background:#fff0b7;color:#501608;border:1px solid #ac732f;border-radius:50%}
.onboarding-language-card:disabled{opacity:.5;filter:none}
.onboarding-actions{margin:0;display:flex;justify-content:space-between;gap:15px;padding:30px 5%;background:linear-gradient(135deg,#690d10d9,#290405e8);border:1px solid #c99751;border-top:none;border-radius:0 0 16px 16px;box-shadow:inset 0 -4px 0 #e3b86910}
.onboarding-actions .btn{min-width:175px;min-height:53px;border-radius:9px;font:20px var(--roman-font)}
.onboarding-actions .btn-primary,.onboarding-body .btn-primary{color:#361005;border:1px solid #ffdfa0;background:linear-gradient(125deg,#fff0bd,#cc9448);box-shadow:0 0 16px #db8c3c30}
.onboarding-actions .btn-ghost{color:#dfbd77;border:1px solid #b48c4b;background:#3f090780}
.onboarding-none{font-size:13px;color:#dbc4ab;background:transparent;border-color:#a8663b;margin-top:18px}
.onboarding-help-wrap{margin-top:16px;text-align:right}
.onboarding-help-wrap>[data-action]{width:42px;height:42px;padding:0;border:1px solid #c39d55;border-radius:50%;color:#e7c87c;font:26px var(--roman-font);background:#410908}
.onboarding-help-wrap>[data-action]:hover{background:#74251a}
.spqr-logo{animation:roman-glow 4s ease-in-out infinite}
@keyframes roman-glow{0%,100%{filter:drop-shadow(0 0 3px #bd7e2877)}50%{filter:drop-shadow(0 0 12px #ffda77bb)}}
.roman-settings-layer{align-items:flex-start;justify-content:flex-end;padding:70px max(24px,5vw);background:#1a02055e}
.quick-settings-modal,html[data-theme="dark"] .quick-settings-modal{width:320px;border:1px solid #b48b46;border-radius:14px;background:linear-gradient(130deg,#641018,#260507);padding:18px;color:#ffe2a8;box-shadow:0 18px 55px #0006}
.roman-account{display:flex;align-items:center;gap:12px;border-bottom:1px solid #b486404a;padding-bottom:15px}
.roman-avatar{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:2px solid #dbb16b;overflow:hidden;background:#62151a;font-size:26px;flex-shrink:0}
.roman-avatar img{width:100%;height:100%;object-fit:cover}
.roman-account a{color:#ead1a7;font-size:12px;text-decoration:none;flex:1}
.roman-control-icons{display:flex;justify-content:space-between;gap:8px;padding-top:17px}
.quick-settings-modal .icon-btn{color:#e9c579;background:#2e0707;border:1px solid #99633070;border-radius:50%;width:45px;height:45px;font:22px var(--roman-font)}
.quick-settings-modal [aria-pressed="false"]{opacity:.5}
.roman-control-icons [data-action="toggle-ipa"]{font-size:15px}
.roman-reset{max-width:420px;border:1px solid #c6a262!important}
button:focus-visible,a:focus-visible,summary:focus-visible,[role="button"]:focus-visible{outline:3px solid #ebbb61;outline-offset:4px}
.card,.lesson-block,.target-card,.pattern-panel,.language-callout,.module-card{border-color:#ad7a3a45!important}
.module-card,.lesson-block,.target-card{border-radius:12px}
.module-compact-header{background:radial-gradient(ellipse at top right,#aa3b2238,transparent 65%),linear-gradient(120deg,#72131a,#34080c);border:1px solid #b28a49!important;box-shadow:0 12px 26px #3b0a0a20;color:#fff0d8}
.module-compact-header h1,.module-compact-header p{color:#fff0d8}.module-compact-header .module-eyebrow{color:#e6bf72}.module-compact-header .btn-primary{background:#f1d59d;color:#511016;border-color:#e4b768}
.module-page-tab.active{background:#71131b!important;color:#fff0d8!important;border-color:#b68b48!important}.lesson-theory-first{border-left:3px solid #9a3031!important}.module-card .module-number{color:#8c171d}
.lesson-block h2,.module-card h3,.foundation-page h2{font-family:var(--roman-font)}
.youtube-frame,.video-frame,.youtube-video,.video-card,.concept-visual,.concept-image,iframe[src*="youtube"]{border:1px solid #b68c46!important;outline:3px solid #b68c4612;outline-offset:3px;border-radius:8px!important;overflow:hidden}
.guide-tabs button{font-family:var(--roman-font)}
.language-guide{color:#f5e4ca;text-align:left;background:#3b0808!important;border:1px solid #986036!important}
.guide-story,.guide-geography{background:#490b0d!important;border-color:#915526!important}
.guide-story-copy h3,.guide-geography h3{color:#ffe0a0;font-family:var(--roman-font)}
.guide-story-copy p,.guide-geography p,.guide-story-copy small{color:#dec8b1}
.guide-tabs{justify-content:center}
.guide-tabs button{color:#ead7bd!important;background:#5c1012!important;border-color:#9b603b!important;display:flex;align-items:center;gap:10px}
.guide-tabs button.active{color:#ffdf8b!important;border-color:#ffcf79!important;background:#7a2019!important}
.guide-tabs .guide-flag{display:inline-block;width:28px;height:28px;border-radius:50%;overflow:hidden;border:1px solid #d5ad5c}
.guide-flag svg{display:block;width:100%;height:100%}
.guide-map{width:100%;height:auto;min-height:300px;max-height:500px;border:1px solid #9f703b;border-radius:6px}
.guide-ocean{fill:#230508!important}.guide-land{fill:#52211e!important;stroke:#8c4834!important}.guide-place{fill:#9c3425!important}.guide-place:hover,.guide-place.active{fill:#d79f45!important}.guide-marker circle{fill:#f5cf6b!important}.guide-marker .guide-marker-hit{fill:transparent!important}
.guide-geography{position:relative}
.guide-country-info{background:#74171a!important;color:#f8dfb3!important;border:1px solid #b88446;border-radius:7px;padding:14px;margin-top:8px}
.guide-tooltip{position:fixed;z-index:100000;max-width:220px;padding:10px 13px;background:#690c13f5;border:1px solid #d09d51;border-radius:7px;color:#ffe8be;box-shadow:0 5px 20px #0005;font-size:12px;pointer-events:none}
.guide-tooltip[hidden]{display:none}.guide-tooltip strong{display:block;margin-bottom:4px}
.roman-action-icon{width:26px;height:26px;vertical-align:middle;margin-right:8px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.guide-sources{font-size:11px;color:#c4a584}.guide-sources a,.guide-map-credit{color:#dec086!important}
.galician-pair{padding:15px 18px;margin-top:20px;border:1px solid #be925740;border-radius:9px;background:#35060788;text-align:left}.galician-pair p{font-size:13px;line-height:1.6;color:#e1cdb2;margin:0 0 9px}.galician-pair button{color:#ffe0a0;font-size:14px;border:1px solid #b0864d}.galician-pair>a{margin-left:15px;font-size:11px;color:#d4ae7a}
.roman-concept-photo{width:min(260px,100%);margin:12px auto;padding:0!important;aspect-ratio: .875;display:block!important;background:#ece0cc;overflow:hidden}.roman-concept-photo.compact{width:110px;max-width:100%}.concept-photo-tile{display:block;width:100%;height:100%;background-image:url('assets/images/concepts/photographic-vocabulary.png');background-size:400% 200%;background-repeat:no-repeat}
@media(max-width:1000px){.onboarding-language-grid,.onboarding-language-grid.native-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.onboarding-language-card{gap:13px;padding:14px}.onboarding-language-copy strong{font-size:19px}.romancemax-hero{padding:48px 7% 28px}.roman-hero-brand h1{font-size:6.8vw}.roman-hero-brand h1>.spqr-logo{width:150px;height:150px}.maxxing-legend .profile-language-chip{min-width:116px}.view-root{padding:26px 20px}.onboarding-window{width:93%}}
@media(max-width:650px){.view-root{padding:14px 10px 35px}.romancemax-hero{padding:65px 15px 25px;border-radius:12px;min-height:520px;background-position:48% center}.roman-hero-brand h1{font-size:8vw;padding-bottom:38px}.roman-hero-brand h1>.spqr-logo{width:125px;height:125px;top:-33px}.roman-hero-brand p{font-size:16px}.hero-actions.centered-actions{gap:10px;flex-wrap:nowrap}.roman-primary,.roman-secondary{min-width:0;flex:1;font-size:13px;padding:12px;min-height:49px}.roman-primary>span,.roman-secondary>span{font-size:23px;margin-right:4px}.maxxing-legend .profile-language-chip{min-width:100px;padding:6px 9px}.dashboard-core-stats{grid-template-columns:1fr;gap:12px}.course-progress-card,.next-lesson-card{padding:20px;min-height:120px}.onboarding-layer{padding:20px 0}.onboarding-brand{padding-bottom:22px}.onboarding-brand .spqr-logo{width:80px;height:80px}.onboarding-wordmark strong{font-size:9vw}.onboarding-body{padding:23px 15px 0}.onboarding-language-grid,.onboarding-language-grid.native-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.onboarding-language-card{min-height:85px;gap:11px;padding:12px 9px}.onboarding-language-card .flag-frame.lg{width:37px;height:37px;min-width:37px}.onboarding-language-copy strong{font-size:17px}.onboarding-check{right:5px;top:5px;width:16px;height:16px;font-size:11px}.onboarding-actions{padding:25px 15px}.onboarding-actions .btn{min-width:0;padding:12px 22px;font-size:17px}.onboarding-copy h1{font-size:27px}.roman-settings-layer{padding:70px 18px}.guide-map{min-height:220px}.guide-story{display:flex;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.spqr-logo,.onboarding-brand .spqr-logo{animation:none}.onboarding-language-card{transition:none}}