:root{--color-bg: #0d0e12;--color-bg-alt: #101318;--color-card-bg: #13171d;--color-border: #252a34;--color-accent-gold: #d4af37;--color-accent-red: #e05446;--color-text-primary: #f5f5f5;--color-text-secondary: #b0b8c1;--color-text-muted: #6a7383;--font-family-base: "Arial", sans-serif;--font-family-heading: "Arial Black", sans-serif;--font-size-base: 16px;--line-height-base: 1.6;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 40px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-base);background-color:var(--color-bg);color:var(--color-text-primary);overflow-x:hidden;-webkit-font-smoothing:antialiased}.container{width:100%;max-width:1200px;margin-inline:auto;padding-inline:var(--space-lg)}.text-center{text-align:center}.cta-button,.primary-button{padding:var(--space-sm) var(--space-lg);border:none;cursor:pointer;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--color-text-primary);background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));border-radius:var(--radius-sm);transition:transform .2s ease,box-shadow .2s ease}.cta-button:hover,.primary-button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #d4af3759}.secondary-button{padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-sm);font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;color:var(--color-accent-gold);background:transparent;border:1px solid var(--color-border);transition:all .2s}.secondary-button:hover{border-color:var(--color-accent-gold);color:var(--color-accent-gold)}.user-button{padding:var(--space-sm) var(--space-lg);background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all .2s}.user-button:hover{border-color:var(--color-accent-gold)}.nav-fixed{position:relative;width:100%;background-color:#0d0e12e6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:1px solid var(--color-border)}.nav-container{display:flex;justify-content:space-between;align-items:center;height:70px;max-width:1200px;margin-inline:auto;padding-inline:var(--space-lg)}.logo{font-family:var(--font-family-heading);font-size:24px;letter-spacing:-1px;background:linear-gradient(45deg,var(--color-text-primary),var(--color-accent-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-links{display:flex;align-items:center;gap:var(--space-lg)}.nav-links>button+button{margin-left:var(--space-sm)}.nav-links a{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--color-text-secondary);text-decoration:none;transition:color .25s}.nav-links a:hover{color:var(--color-accent-gold)}.hero{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:90vh;text-align:center;background:radial-gradient(circle at 30% 30%,rgba(212,175,55,.2),transparent 50%),radial-gradient(circle at 70% 70%,rgba(224,84,70,.15),transparent 50%)}.hero-title{font-family:var(--font-family-heading);font-size:clamp(36px,8vw,72px);font-weight:900;line-height:.9;margin-bottom:var(--space-md);letter-spacing:-1px}.hero-content{padding:var(--space-md)}.hero-title .accent{background:linear-gradient(45deg,var(--color-accent-gold),var(--color-accent-red));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{color:var(--color-text-secondary);font-size:18px;margin-bottom:var(--space-lg);letter-spacing:.5px}.hero-cta{display:flex;flex-wrap:wrap;gap:var(--space-md);justify-content:center}.stats{background-color:var(--color-bg-alt);padding-block:var(--space-xl);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}.stats-container{display:grid;gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));max-width:1200px;margin-inline:auto;padding-inline:var(--space-lg)}.stat-card{text-align:center;padding:var(--space-lg);border:1px solid var(--color-border);background-color:var(--color-card-bg);border-radius:var(--radius-md);transition:border-color .2s ease,transform .2s ease}.stat-card:hover{border-color:var(--color-accent-gold);transform:translateY(-4px)}.stat-number{font-size:40px;font-weight:800;background:linear-gradient(45deg,var(--color-text-primary),var(--color-accent-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:1px;font-size:12px;margin-top:var(--space-sm)}.features{padding-block:var(--space-xl);background-color:var(--color-bg)}.section-title{font-family:var(--font-family-heading);font-size:36px;font-weight:900;margin-bottom:var(--space-lg);text-align:center;letter-spacing:-1px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-lg);max-width:1200px;margin-inline:auto;padding-inline:var(--space-lg)}.feature-card{position:relative;padding:var(--space-lg);border:1px solid var(--color-border);background:linear-gradient(135deg,var(--color-card-bg),var(--color-bg-alt));border-radius:var(--radius-md);transition:transform .2s ease,border-color .2s ease;overflow:hidden}.feature-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--color-accent-gold),var(--color-accent-red));transform:translate(-100%);transition:transform .4s ease}.feature-card:hover:before{transform:translate(0)}.feature-card:hover{transform:translateY(-4px);border-color:var(--color-accent-gold)}.feature-icon{width:48px;height:48px;margin-bottom:var(--space-sm);display:flex;align-items:center;justify-content:center;font-size:20px;background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));border-radius:var(--radius-sm)}.feature-title{font-size:20px;font-weight:700;margin-bottom:var(--space-sm)}.feature-description{font-size:14px;color:var(--color-text-secondary);line-height:1.5}.pricing{padding-block:var(--space-xl);background-color:var(--color-bg-alt)}.pricing-container{max-width:1200px;margin-inline:auto;padding-inline:var(--space-lg)}.pricing-grid{display:grid;gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:var(--space-lg)}.pricing-card{padding:var(--space-lg);border:1px solid var(--color-border);background-color:var(--color-card-bg);border-radius:var(--radius-md);text-align:center;position:relative;transition:transform .2s ease,border-color .2s ease}.pricing-card:hover{transform:translateY(-4px);border-color:var(--color-accent-gold)}.pricing-card.featured{border-color:var(--color-accent-gold);transform:scale(1.02)}.pricing-card.featured:hover{transform:scale(1.02) translateY(-4px)}.pricing-card.featured:before{content:"Most Popular";position:absolute;top:-14px;left:50%;transform:translate(-50%);background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));color:var(--color-bg);padding:var(--space-xs) var(--space-md);font-size:10px;letter-spacing:1px;font-weight:700;border-radius:var(--radius-sm);text-transform:uppercase}.pricing-tier{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--color-text-secondary);margin-bottom:var(--space-sm)}.pricing-amount{font-size:40px;font-weight:800;margin-bottom:var(--space-sm);background:linear-gradient(45deg,var(--color-text-primary),var(--color-accent-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.pricing-period{font-size:14px;color:var(--color-text-secondary);margin-bottom:var(--space-md)}.pricing-features{list-style:none;margin-bottom:var(--space-lg)}.pricing-features li{padding-block:var(--space-sm);border-bottom:1px solid var(--color-border);color:var(--color-text-secondary);font-size:14px}.pricing-card button{margin-top:var(--space-sm)}.dashboard-container{min-height:100vh;display:flex;flex-direction:column}.secondary-nav{margin:var(--space-lg);padding-inline:var(--space-lg);display:flex;justify-content:center}.navPillContainer{background:var(--color-bg-alt);border:1px solid var(--color-border);border-radius:var(--radius-sm);display:flex;gap:var(--space-xs);padding:var(--space-xs)}.navPillButton{border:none;font-weight:700;text-transform:uppercase;padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);cursor:pointer;font-size:12px;letter-spacing:1px;font-family:inherit;background:transparent;color:var(--color-text-secondary);transition:color .3s,background .3s}.navPillButton:hover{color:var(--color-text-primary)}.navPillButtonActive{background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));color:var(--color-text-primary)}.mainContent{margin-inline:auto;width:960px;padding-inline:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-lg);flex:1 0 auto}.contentCard{background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-lg);color:var(--color-text-primary)}.contentCard>h2{margin-bottom:var(--space-md);font-size:22px}.tutorialGrid{display:grid;gap:var(--space-xl);grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.tutorialCard{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);transition:border-color .2s,transform .2s}.tutorialCard:hover{border-color:var(--color-accent-gold);transform:translateY(-2px)}.tutorialTitle{margin-bottom:var(--space-xs);font-size:16px;color:var(--color-text-primary)}.tutorialMeta{font-size:13px;color:var(--color-text-secondary)}.tutorials-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-lg)}.tutorials-header h2{margin:0}.filter-toggle{display:flex;align-items:center;gap:var(--space-sm);color:var(--color-text-secondary);font-size:14px;cursor:pointer}.filter-toggle input[type=checkbox]{cursor:pointer}.tutorialCard{position:relative;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);transition:border-color .2s,transform .2s,box-shadow .2s}.tutorialCard.aligned{border-color:var(--color-accent-gold);background:linear-gradient(135deg,var(--color-bg),rgba(212,175,55,.05));box-shadow:0 0 0 1px var(--color-accent-gold)}.tutorialCard:hover{transform:translateY(-2px)}.tutorialCard.aligned:hover{box-shadow:0 4px 12px #d4af3733}.tutorialAlignedBadge{position:absolute;top:-10px;left:var(--space-md);padding:var(--space-xs) var(--space-sm);background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));border-radius:var(--radius-sm);font-size:11px;color:var(--color-text-primary);font-weight:700;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 8px #d4af374d}.no-tutorials-message{color:var(--color-text-secondary);text-align:center;padding:var(--space-xl)}@media (max-width: 768px){.tutorials-header{flex-direction:column;align-items:flex-start;gap:var(--space-md)}}.roadmapItem{display:flex;align-items:center;gap:var(--space-md);padding-block:var(--space-sm);border-bottom:1px solid var(--color-border)}.roadmapItem:last-child{border-bottom:0}.roadmapCircle{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0;background:var(--color-card-bg);color:var(--color-text-secondary);border:1px solid var(--color-border)}.roadmapCircleComplete{background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));color:var(--color-bg);border-color:transparent}.roadmapCircleCurrent{color:var(--color-text-primary);border-color:var(--color-accent-gold);box-shadow:0 0 0 2px #d4af3726}.roadmapCircleLocked{opacity:.6}footer{padding-block:var(--space-xl);background-color:var(--color-bg);border-top:1px solid var(--color-border);color:var(--color-text-secondary)}.footer-content{max-width:1200px;margin-inline:auto;padding-inline:var(--space-lg)}.footer-links{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--space-md);margin-bottom:var(--space-md)}.footer-links a{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--color-text-secondary);text-decoration:none;transition:color .25s}.footer-links a:hover{color:var(--color-accent-gold)}.copyright{font-size:12px;color:var(--color-text-muted);text-align:center}.site-footer{margin-top:var(--space-xl);padding:var(--space-xl) var(--space-lg);background:var(--color-bg-alt);border-top:1px solid var(--color-border);color:var(--color-text-primary)}.footer__inner{max-width:900px;margin-inline:auto;display:flex;flex-direction:row;justify-content:space-between;gap:var(--space-lg)}.site-footer.is-mobile .footer__inner{flex-direction:column}.footer__brandTitle{margin-bottom:var(--space-sm);font-size:20px;font-weight:700;background:linear-gradient(45deg,var(--color-text-primary),var(--color-text-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.footer__brandText{margin:0;font-size:14px;color:var(--color-text-secondary);line-height:1.6}.footer__cols{display:flex;gap:var(--space-lg);flex-wrap:wrap}.footer__heading{margin-bottom:var(--space-sm);font-size:12px;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:1px}.footer__list{display:flex;flex-direction:column;gap:var(--space-sm)}.footer__link{color:var(--color-text-secondary);text-decoration:none;font-size:14px}.footer__link:hover{color:var(--color-text-primary)}.footer__bottom{max-width:900px;margin:var(--space-lg) auto 0;padding-top:var(--space-lg);border-top:1px solid var(--color-border);text-align:center}.footer__copyright{margin:0;font-size:12px;color:var(--color-text-muted)}@media (max-width: 768px){.nav-container{padding-inline:var(--space-md);height:60px}.logo{font-size:20px}.nav-links{gap:var(--space-sm)}.nav-links a{display:none}.nav-links button{padding:var(--space-sm);font-size:10px}.hero-title{font-size:clamp(32px,10vw,56px)}.hero-subtitle{font-size:16px}.pricing-card.featured{transform:none}.mainContent{max-width:100%;padding:0 var(--space-xs);margin-inline:0}.tutorialGrid,.pricing-grid,.features-grid{grid-template-columns:1fr}.tutorialGrid{gap:var(--space-sm)}.navPillContainer{gap:var(--space-xs);padding:var(--space-xs)}.navPillButton{padding:var(--space-xs) var(--space-sm);font-size:11px}.site-footer .footer__inner{flex-direction:column;gap:var(--space-lg)}.secondary-nav{padding-inline:var(--space-md)}}.ai-coach{display:flex;flex-direction:column;border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;height:720px}.ai-coach.is-mobile{height:calc(100dvh - 180px)}.ai-coach__header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border);background:var(--color-bg-alt)}.ai-coach__title{font-size:1rem;color:var(--color-text-primary);margin:0;font-family:Courier New,Courier,monospace;letter-spacing:.05em}.ai-coach__clear{font-size:.75rem;color:var(--color-text-muted);background:transparent;border:none;cursor:pointer;padding:var(--space-xs) var(--space-sm);transition:color .2s;font-family:Courier New,Courier,monospace}.ai-coach__clear:hover{color:var(--color-text-secondary)}.ai-coach__scroll{flex:1;overflow-y:auto;padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md);scroll-behavior:smooth;scrollbar-gutter:stable both-edges;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--color-border) var(--color-bg)}.ai-coach__scroll::-webkit-scrollbar{width:8px}.ai-coach__scroll::-webkit-scrollbar-track{background:var(--color-bg)}.ai-coach__scroll::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-sm)}.ai-coach__scroll::-webkit-scrollbar-thumb:hover{background:#3a4150}.msg-row{display:flex}.msg-row.align-start{justify-content:flex-start}.msg-row.align-end{justify-content:flex-end}.bubble{max-width:70%;padding:var(--space-md) var(--space-lg);line-height:1.6;border:1px solid var(--color-border);font-size:15px;word-break:break-word;border-radius:var(--radius-lg)}.bubble.from-user{background:var(--color-border);color:var(--color-text-secondary);border-radius:var(--radius-lg) var(--radius-lg) var(--radius-sm) var(--radius-lg)}.bubble.from-assistant{background:var(--color-card-bg);color:var(--color-text-primary);border-radius:var(--radius-lg) var(--radius-lg) var(--radius-lg) var(--radius-sm)}.assistant-label{font-size:11px;color:var(--color-text-muted);margin-bottom:var(--space-xs);letter-spacing:.5px;text-transform:uppercase}.ai-coach__scroll .msg-row:last-child .bubble{animation:bubbleIn .14s ease-out}@keyframes bubbleIn{0%{transform:translateY(4px);opacity:.85}to{transform:translateY(0);opacity:1}}.bubble a{color:var(--color-accent-gold);text-decoration:underline;font-weight:500;transition:color .2s}.bubble a:hover{color:var(--color-accent-red)}.bubble ul,.bubble ol{margin:var(--space-sm) 0;padding-left:var(--space-lg)}.bubble li{margin:var(--space-xs) 0}.bubble strong{font-weight:700;color:var(--color-text-primary)}.bubble h2,.bubble h3{margin:var(--space-md) 0 var(--space-sm);font-size:1.1em;font-weight:700;color:var(--color-text-primary)}.bubble p{margin:var(--space-sm) 0}.bubble p:first-child{margin-top:0}.bubble p:last-child{margin-bottom:0}.composer{display:flex;gap:var(--space-md);align-items:center;padding:var(--space-md);background:var(--color-bg-alt);border-top:1px solid var(--color-border)}.composer__input{width:100%;flex:1;padding:var(--space-sm) var(--space-md);background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:16px;color:var(--color-text-primary);outline:none;transition:border-color .2s;overflow-y:hidden;resize:none;min-height:36px;max-height:160px}.composer__input:focus{border-color:var(--color-accent-gold)}.composer__sendBtn{padding:var(--space-sm) var(--space-lg);border:none;cursor:pointer;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--color-text-primary);background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));border-radius:var(--radius-sm);transition:transform .2s ease,box-shadow .2s ease}.composer__sendBtn:active{transform:translateY(1px)}.composer__sendBtn:disabled{background:var(--color-border);color:var(--color-text-muted);cursor:default}.tutorialCard.aligned{border-color:var(--color-accent-gold);box-shadow:0 0 0 1px var(--color-accent-gold)}.tutorialAlignedTag{display:inline-block;margin-top:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:#d4af371a;border:1px solid var(--color-accent-gold);border-radius:var(--radius-sm);font-size:11px;color:var(--color-accent-gold);text-transform:uppercase;letter-spacing:.5px}@media (max-width: 768px){.ai-coach{height:calc(100dvh - 160px);border-radius:var(--radius-md)}.ai-coach__scroll{padding:var(--space-md);gap:var(--space-md)}.bubble{max-width:85%;padding:var(--space-sm) var(--space-md);font-size:14px}.composer{gap:var(--space-sm);padding:var(--space-md)}.composer__input{font-size:14px}.composer__sendBtn{padding:var(--space-sm) var(--space-md);font-size:11px}}@media (max-width: 480px){.composer{flex-direction:column}.composer__sendBtn{width:100%}}.profile-page{padding-bottom:var(--space-xl);background:var(--color-bg)}.profile-container{max-width:960px;margin:0 auto;padding:var(--space-lg)}.profile-header-page{margin:var(--space-md)}.profile-header-page h1{font-family:var(--font-family-heading);font-size:36px;font-weight:900;margin-bottom:var(--space-md);color:var(--color-text-primary)}.back-button{background:transparent;border:none;color:var(--color-text-secondary);font-size:14px;cursor:pointer;padding:var(--space-sm) 0;margin-bottom:var(--space-md);transition:color .2s}.back-button:hover{color:var(--color-accent-gold)}.profile-section{margin-bottom:var(--space-xl);padding:var(--space-lg);background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-md)}.profile-section h3{margin:0 0 var(--space-lg) 0;font-size:18px;font-weight:700;color:var(--color-text-primary)}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-lg)}.section-header h3{margin:0}.retake-button{background:transparent;border:1px solid var(--color-border);color:var(--color-text-secondary);padding:var(--space-xs) var(--space-md);border-radius:var(--radius-sm);cursor:pointer;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;transition:all .2s}.retake-button:hover{border-color:var(--color-accent-gold);color:var(--color-accent-gold)}.goal-item{margin-bottom:var(--space-lg)}.goal-item:last-child{margin-bottom:0}.goal-label{color:var(--color-text-muted);font-size:12px;letter-spacing:1px;margin-bottom:var(--space-sm);text-transform:uppercase}.goal-value{display:inline-block;font-size:16px;color:var(--color-text-primary)}.skill-level{text-transform:capitalize;font-weight:600}.goal-tags{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.goal-tag{background:var(--color-bg);padding:var(--space-xs) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:12px;text-transform:capitalize;color:var(--color-text-secondary)}.input-group{margin-bottom:var(--space-lg)}.input-label{display:block;margin-bottom:var(--space-sm);color:var(--color-text-secondary);font-size:14px;font-weight:600}.profile-input{width:100%;padding:var(--space-md);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:16px;transition:border-color .2s}.profile-input:focus{outline:none;border-color:var(--color-accent-gold)}.profile-input.disabled{color:var(--color-text-muted);opacity:.7;cursor:not-allowed}.profile-save{width:100%;margin-bottom:var(--space-lg)}.profile-save:disabled{opacity:.5;cursor:not-allowed}.profile-message{margin-top:var(--space-lg);text-align:center;font-size:14px;font-weight:600}.profile-message.success{color:var(--color-accent-gold)}.profile-message.error{color:var(--color-accent-red)}.demographics-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-lg)}.demo-item{display:flex;flex-direction:column}.demo-item.full-width{grid-column:1 / -1}@media (max-width: 768px){.demographics-grid{grid-template-columns:1fr}}@media (max-width: 768px){.profile-container{padding:var(--space-xs)}.profile-header-page h1{font-size:28px}.section-header{flex-direction:column;align-items:flex-start;gap:var(--space-sm)}.retake-button{width:100%}}.onboarding-container{margin:var(--space-lg);display:flex;align-items:center;justify-content:center;background:var(--color-bg)}.onboarding-card{max-width:600px;width:90%;padding:var(--space-xl);background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-md)}.onboarding-title{margin-bottom:var(--space-sm);font-family:var(--font-family-heading);font-size:32px;font-weight:900}.onboarding-subtitle{color:var(--color-text-secondary);margin-bottom:var(--space-xl);font-size:16px}.onboarding-step{width:100%}.step-title{margin-bottom:var(--space-lg);font-size:20px;font-weight:700;color:var(--color-text-primary)}.option-button{display:block;width:100%;padding:var(--space-lg);margin-bottom:var(--space-md);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);cursor:pointer;text-align:left;transition:all .2s ease}.option-button.compact{padding:var(--space-md);margin-bottom:var(--space-sm)}.option-button:hover{border-color:var(--color-accent-gold);transform:translateY(-2px)}.option-button.selected{background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));border-color:transparent}.option-button:disabled{opacity:.5;cursor:not-allowed}.option-title{display:block;font-size:16px;font-weight:700;text-transform:capitalize}.option-description{font-size:12px;margin-top:var(--space-xs);opacity:.8;color:var(--color-text-secondary)}.option-button.selected .option-description{color:var(--color-text-primary)}.onboarding-next{width:100%;margin-top:var(--space-lg)}.onboarding-next:disabled{opacity:.5;cursor:not-allowed;transform:none}.age-input{width:100%;padding:var(--space-md);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:18px;margin-bottom:var(--space-lg);transition:border-color .2s}.age-input:focus{outline:none;border-color:var(--color-accent-gold)}.country-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-md);margin-bottom:var(--space-lg)}.country-button{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);padding:var(--space-lg)}.country-flag{font-size:32px;margin-bottom:var(--space-xs)}.step-description{color:var(--color-text-secondary);font-size:14px;margin-bottom:var(--space-md)}.skills-textarea{width:100%;padding:var(--space-md);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text-primary);font-size:16px;font-family:inherit;margin-bottom:var(--space-lg);resize:vertical;transition:border-color .2s}.skills-textarea:focus{outline:none;border-color:var(--color-accent-gold)}@media (max-width: 768px){.country-grid{grid-template-columns:1fr}}@media (max-width: 768px){.onboarding-container{padding-top:80px}.onboarding-card{width:95%;padding:var(--space-lg)}.onboarding-title{font-size:24px}.onboarding-subtitle{font-size:14px}}.tutorial-overlay{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:3000;padding:var(--space-lg);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.tutorial-modal{background:var(--color-card-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);max-width:800px;width:100%;max-height:85vh;overflow-y:auto;padding:var(--space-xl);position:relative}.tutorial-close{position:absolute;top:var(--space-lg);right:var(--space-lg);background:transparent;border:none;font-size:32px;color:var(--color-text-secondary);cursor:pointer;line-height:1;transition:color .2s}.tutorial-close:hover{color:var(--color-text-primary)}.tutorial-header{margin-bottom:var(--space-xl);padding-bottom:var(--space-lg);border-bottom:1px solid var(--color-border)}.tutorial-header h1{font-size:28px;margin-bottom:var(--space-md);color:var(--color-text-primary)}.tutorial-meta{display:flex;gap:var(--space-md);align-items:center}.meta-badge{padding:var(--space-xs) var(--space-sm);background:linear-gradient(45deg,var(--color-accent-red),var(--color-accent-gold));border-radius:var(--radius-sm);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px}.meta-time{color:var(--color-text-secondary);font-size:14px}.tutorial-content{color:var(--color-text-primary);line-height:1.8}.tutorial-content h2{font-size:22px;margin-top:var(--space-xl);margin-bottom:var(--space-md);color:var(--color-text-primary)}.tutorial-content h3{font-size:18px;margin-top:var(--space-lg);margin-bottom:var(--space-sm)}.tutorial-content p{margin-bottom:var(--space-md)}.tutorial-content ul,.tutorial-content ol{margin:var(--space-md) 0;padding-left:var(--space-xl)}.tutorial-content li{margin-bottom:var(--space-sm)}.tutorial-content strong{color:var(--color-accent-gold)}.tutorial-keypoints{margin-top:var(--space-xl);padding:var(--space-lg);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md)}.tutorial-keypoints h3{font-size:18px;margin-bottom:var(--space-md);color:var(--color-accent-gold)}.tutorial-keypoints ul{list-style:none;padding:0}.tutorial-keypoints li{padding-left:var(--space-lg);margin-bottom:var(--space-sm);position:relative}.tutorial-keypoints li:before{content:"→";position:absolute;left:0;color:var(--color-accent-gold)}@media (max-width: 768px){.tutorial-overlay{padding:0}.tutorial-modal{max-height:100vh;border-radius:0;padding:var(--space-lg)}}