:root { --ink:#1c2528; --muted:#697477; --line:#dfe5e6; --paper:#f5f5f1; --white:#fff; --navy:#26345d; --navy-dark:#1e294a; --violet:#76569d; --coral:#d86e55; --aqua:#37968e; --shadow:0 2px 4px rgba(20,35,40,.04),0 18px 42px rgba(20,35,40,.09); --radius:16px; --ease:cubic-bezier(.16,1,.3,1); }
* { box-sizing:border-box; } html { background:var(--paper); } body { margin:0; color:var(--ink); font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif; line-height:1.5; } button,input,textarea { font:inherit; } button { cursor:pointer; } a { color:inherit; text-decoration:none; } button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid rgba(49,124,172,.35); outline-offset:3px; }.kicker { margin:0 0 15px; color:inherit; font-size:12px; font-weight:750; letter-spacing:.08em; }.system-brand { display:inline-flex; gap:9px; align-items:center; font-weight:750; font-size:16px; }.system-brand span { display:grid; place-items:center; width:26px; height:26px; border-radius:8px 8px 8px 2px; color:#fff; background:var(--navy); font-size:13px; }.system-brand.inverse { color:#fff; }.system-brand.inverse span { background:#e7ba65; color:#5c4213; }

.gateway-body { min-height:100svh; background:#eef0e8; }.gateway-page { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(440px,.92fr); min-height:100svh; }.gateway-story { position:relative; display:flex; flex-direction:column; min-height:720px; padding:30px clamp(32px,6vw,86px) 38px; overflow:hidden; color:#fff; background:#24355f; }.story-nav { position:relative; z-index:2; display:flex; justify-content:space-between; align-items:center; }.story-nav .system-brand span { background:#f0c46b; color:#5d4412; }.admin-link { padding:8px 0; color:rgba(255,255,255,.74); font-size:13px; }.story-copy { position:relative; z-index:2; max-width:470px; margin:auto 0; }.story-copy .kicker { color:#d5e0ff; }.story-copy h1 { margin:0; font-size:clamp(53px,6vw,84px); line-height:1.02; letter-spacing:0; }.story-copy h1 em { color:#f0c46b; font-style:normal; }.story-copy > p:last-child { max-width:390px; margin:25px 0 0; color:rgba(255,255,255,.72); font-size:17px; line-height:1.8; }.story-foot { position:relative; z-index:2; margin:0; color:rgba(255,255,255,.5); font-size:12px; }.constellation { position:absolute; width:min(52vw,690px); height:620px; right:-115px; top:11%; opacity:.97; }.orbit { position:absolute; border:1px solid rgba(238,244,255,.18); border-radius:50%; }.orbit-a { width:500px; height:500px; left:36px; top:62px; }.orbit-b { width:345px; height:345px; left:114px; top:141px; }.axis-line { position:absolute; left:30px; top:310px; width:520px; border-top:1px solid rgba(238,244,255,.24); transform:rotate(-28deg); }.star { position:absolute; z-index:1; width:13px; height:13px; border-radius:50%; box-shadow:0 0 0 8px rgba(255,255,255,.08); }.star-a { left:118px; top:235px; background:#efc169; }.star-b { left:268px; top:150px; background:#8fc2e9; }.star-c { left:392px; top:256px; background:#d999bf; }.star-d { left:224px; top:395px; background:#78bd9d; }.star-e { left:475px; top:424px; background:#efc169; }.axis-label { position:absolute; color:rgba(255,255,255,.55); font-size:12px; }.label-a { left:78px; top:155px; }.label-b { left:442px; top:176px; }.label-c { left:433px; top:485px; }
.gateway-panel { padding:clamp(38px,7vw,90px) clamp(28px,6vw,75px); background:#fbfbf8; }.unlock-card { max-width:460px; margin:0 auto; padding-top:6vh; }.unlock-card .kicker { color:var(--coral); }.unlock-card h2,.choice-heading h2 { margin:0; font-size:clamp(30px,3vw,38px); line-height:1.22; }.unlock-card > p:not(.kicker) { max-width:390px; color:var(--muted); font-size:15px; line-height:1.8; }.code-label { display:block; margin-top:34px; color:#4a5658; font-size:13px; font-weight:700; }.code-row { display:grid; grid-template-columns:1fr auto; gap:10px; margin-top:8px; }.code-row input { min-width:0; height:54px; padding:0 18px; border:1px solid #ccd4d5; border-radius:9px; color:var(--navy); background:#fff; font-size:24px; letter-spacing:.27em; text-align:center; }.code-row input::placeholder { color:#bdc6c7; letter-spacing:.15em; }.unlock-button,.admin-primary { min-height:54px; padding:0 20px; border:0; border-radius:9px; color:#fff; background:var(--navy); font-weight:750; transition:transform .15s var(--ease),background .15s ease; }.unlock-button:hover,.admin-primary:hover { background:var(--navy-dark); transform:translateY(-1px); }.unlock-button:disabled,.admin-primary:disabled { opacity:.6; cursor:wait; transform:none; }.form-message { min-height:20px; margin:10px 0 0; color:var(--muted); font-size:13px; }.form-message.error { color:#bc4c4d; }.form-message.success { color:#287257; }.choice-area { max-width:480px; margin:0 auto; padding-top:4vh; }.choice-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:24px; }.choice-heading .kicker { color:var(--aqua); }.quiet-button { min-height:42px; padding:0 10px; border:0; color:#667477; background:transparent; font-size:13px; }.quiet-button:hover { color:var(--navy); }.assessment-choice { display:grid; grid-template-columns:42px 1fr 26px; align-items:center; gap:15px; min-height:112px; padding:20px; margin-bottom:10px; border:1px solid var(--line); border-radius:13px; background:#fff; transition:transform .15s var(--ease),box-shadow .15s ease,border-color .15s ease; }.assessment-choice:hover { transform:translateY(-2px); box-shadow:var(--shadow); }.talent-choice:hover { border-color:#78b3a3; }.career-choice:hover { border-color:#8e9cdb; }.choice-index { color:#fff; display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:#21877e; font-size:12px; font-weight:750; }.career-choice .choice-index { background:#596bc6; }.assessment-choice h3 { margin:0 0 3px; font-size:18px; }.assessment-choice p { margin:0; color:var(--muted); font-size:13px; }.choice-arrow { color:#8b9799; font-size:23px; }.gateway-notes { display:grid; gap:16px; max-width:480px; margin:clamp(60px,12vh,145px) auto 0; padding-top:28px; border-top:1px solid var(--line); }.gateway-notes article { display:flex; gap:13px; }.gateway-notes article > span { color:#97a2a4; font-size:12px; font-variant-numeric:tabular-nums; }.gateway-notes h3 { margin:0 0 3px; font-size:14px; }.gateway-notes p { margin:0; color:var(--muted); font-size:13px; line-height:1.65; }

.career-body { min-height:100svh; background:#f4f5f3; }.career-topbar { height:70px; display:flex; align-items:center; justify-content:space-between; padding:0 max(24px,calc((100vw - 1120px)/2)); color:#fff; background:#26345d; }.career-topbar-title { display:flex; align-items:center; gap:8px; color:rgba(255,255,255,.75); font-size:14px; }.career-topbar-title i { width:7px; height:7px; border-radius:50%; background:#e5bf70; }.back-link { color:inherit; font-size:13px; }.career-app { width:min(1120px,calc(100% - 48px)); margin:0 auto; }.career-home { display:grid; grid-template-columns:1.05fr .95fr; gap:74px; align-items:center; min-height:560px; padding:70px 0; }.career-hero-copy .kicker,.career-report .kicker { color:#596bc6; }.career-hero-copy h1,.report-lead h1 { margin:0; font-size:clamp(45px,6vw,70px); line-height:1.08; letter-spacing:0; }.career-hero-copy h1 em { color:#ce6a5d; font-style:normal; }.career-hero-copy > p:not(.kicker) { max-width:530px; margin:23px 0 28px; color:var(--muted); font-size:17px; line-height:1.8; }.career-primary { min-height:52px; padding:0 20px; border:0; border-radius:9px; color:#fff; background:#26345d; box-shadow:0 10px 22px rgba(38,52,93,.2); font-weight:750; transition:transform .15s var(--ease),background .15s ease; }.career-primary:hover { background:#182343; transform:translateY(-1px); }.career-primary span { margin-left:13px; font-size:18px; }.career-facts { display:flex; gap:30px; margin-top:31px; color:var(--muted); font-size:12px; }.career-facts strong { display:block; margin-bottom:2px; color:var(--ink); font-size:17px; }.career-visual { min-height:358px; padding:27px; border-radius:18px; color:#fff; overflow:hidden; background:#e8b463; box-shadow:0 17px 35px rgba(146,96,20,.18); }.visual-top { display:flex; justify-content:space-between; color:rgba(67,48,19,.72); font-size:13px; }.visual-map { position:relative; height:265px; margin-top:20px; background-image:linear-gradient(rgba(86,64,24,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(86,64,24,.13) 1px,transparent 1px); background-size:45px 45px; border-left:1px solid rgba(86,64,24,.35); border-bottom:1px solid rgba(86,64,24,.35); }.map-axis { position:absolute; height:1px; background:rgba(86,64,24,.48); transform-origin:left center; }.axis-one { width:245px; left:34px; top:222px; transform:rotate(-52deg); }.axis-two { width:190px; left:96px; top:196px; transform:rotate(-19deg); }.map-dot { position:absolute; width:18px; height:18px; border:4px solid rgba(255,255,255,.78); border-radius:50%; box-shadow:0 0 0 6px rgba(255,255,255,.18); }.dot-one { left:70px; top:180px; background:#4d98a6; }.dot-two { left:175px; top:92px; background:#b6578e; }.dot-three { left:242px; top:160px; background:#4d9b69; }.dot-four { left:147px; top:209px; background:#655cae; }.map-tag { position:absolute; padding:4px 8px; border-radius:99px; color:#573e10; background:rgba(255,255,255,.57); font-size:11px; }.tag-one { left:155px; top:40px; }.tag-two { left:249px; top:120px; }.tag-three { left:35px; top:220px; }.career-overview { display:grid; grid-template-columns:.9fr 1.1fr; gap:45px; align-items:center; padding:52px 0 70px; border-top:1px solid var(--line); }.career-overview .kicker { color:#d56a54; }.career-overview h2 { max-width:380px; margin:0; font-size:28px; line-height:1.3; }.work-pill-grid { display:flex; flex-wrap:wrap; gap:9px; }.work-pill-grid span { display:flex; align-items:center; gap:8px; padding:10px 13px; border-radius:9px; color:var(--tone); background:var(--tone-pale); font-size:14px; font-weight:700; }.work-pill-grid i { width:7px; height:7px; border-radius:50%; background:var(--tone); }
.career-test { max-width:750px; min-height:calc(100svh - 70px); padding:40px 0 50px; margin:0 auto; }.career-test header,.career-test footer { display:flex; justify-content:space-between; align-items:center; }.career-test header .back-link { color:var(--muted); }.test-count { color:var(--muted); font-size:14px; }.test-count strong { color:var(--ink); }.career-progress { height:7px; overflow:hidden; margin:23px 0; border-radius:99px; background:#dfe4e5; }.career-progress i { display:block; height:100%; border-radius:inherit; background:var(--tone); transition:width .2s var(--ease); }.career-question { padding:clamp(25px,5vw,50px); border-radius:18px; background:#fff; box-shadow:var(--shadow); }.question-meta { display:flex; justify-content:space-between; color:var(--tone); font-size:14px; font-weight:750; }.question-meta small { color:var(--muted); font-size:12px; font-weight:500; }.career-question h1 { margin:33px 0; font-size:clamp(27px,4vw,37px); line-height:1.35; letter-spacing:0; }.career-options { display:grid; gap:10px; }.career-options button { display:flex; align-items:center; gap:14px; min-height:58px; padding:10px 14px; border:1px solid #e0e5e5; border-radius:9px; color:#364245; background:#fff; text-align:left; transition:transform .15s var(--ease),background .15s ease,border-color .15s ease; }.career-options button:hover { border-color:var(--tone); background:var(--tone-pale); transform:translateX(2px); }.career-options b { display:grid; place-items:center; width:27px; height:27px; border:1px solid currentColor; border-radius:50%; font-size:13px; }.career-test footer { margin-top:22px; color:var(--muted); font-size:13px; }.career-test footer .quiet-button { color:var(--muted); }
.career-report { padding:62px 0; }.report-lead { max-width:700px; }.report-lead > p:last-child { max-width:530px; margin:19px 0 0; color:var(--muted); font-size:16px; line-height:1.8; }.work-style-card { display:grid; grid-template-columns:1fr 285px; gap:30px; align-items:center; min-height:265px; padding:35px 40px; margin-top:35px; overflow:hidden; border-radius:18px; color:#fff; background:#26345d; }.work-style-card span { color:#cbd5ff; font-size:13px; }.work-style-card h2 { max-width:570px; margin:12px 0; font-size:27px; line-height:1.35; }.work-style-card p { margin:0; color:rgba(255,255,255,.72); font-size:14px; }.type-orbit { position:relative; width:205px; height:205px; margin:auto; border:1px solid rgba(255,255,255,.18); border-radius:50%; }.type-orbit::before,.type-orbit::after { content:""; position:absolute; border:1px solid rgba(255,255,255,.14); border-radius:50%; }.type-orbit::before { inset:30px; }.type-orbit::after { inset:66px; }.type-orbit i { position:absolute; left:94px; top:94px; z-index:1; width:16px; height:16px; border-radius:50%; background:#efc169; }.type-orbit b { position:absolute; z-index:2; padding:5px 8px; border-radius:99px; color:#26345d; background:#fff; font-size:11px; }.type-orbit b:nth-of-type(1) { top:-8px; left:66px; }.type-orbit b:nth-of-type(2) { right:-17px; bottom:35px; }.type-orbit b:nth-of-type(3) { left:-18px; bottom:40px; }.career-report-section { margin-top:55px; }.section-title { display:flex; gap:14px; align-items:flex-start; margin-bottom:22px; }.section-index { display:grid; flex:0 0 auto; place-items:center; width:31px; height:31px; border-radius:8px; color:#596bc6; background:#eceeff; font-size:12px; font-weight:800; }.section-title h2 { margin:0; font-size:24px; }.section-title p { margin:5px 0 0; color:var(--muted); font-size:14px; }.job-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.job-grid article { min-height:180px; padding:21px; border-radius:13px; background:var(--tone-pale); }.job-grid span { color:var(--tone); font-size:12px; font-weight:800; }.job-grid h3 { margin:33px 0 5px; font-size:17px; line-height:1.35; }.job-grid p { margin:0; color:var(--muted); font-size:12px; line-height:1.6; }.career-score-card { display:grid; grid-template-columns:repeat(2,1fr); gap:14px 36px; padding:27px; border-radius:13px; background:#fff; box-shadow:var(--shadow); }.career-score-card > div { display:grid; grid-template-columns:48px 1fr 34px; gap:10px; align-items:center; }.career-score-card span { font-size:14px; font-weight:700; }.career-score-card i { overflow:hidden; height:8px; border-radius:99px; background:var(--tone-pale); }.career-score-card i b { display:block; height:100%; border-radius:inherit; background:var(--tone); }.career-score-card strong { color:var(--tone); text-align:right; font-size:13px; }.report-actions { display:flex; justify-content:center; gap:12px; margin-top:37px; }.secondary-button { display:inline-grid; place-items:center; min-height:50px; padding:0 19px; border:1px solid var(--line); border-radius:9px; color:#3b4749; background:#fff; font-weight:700; }

.admin-body { min-height:100svh; background:#eef0ed; }.admin-app { min-height:100svh; }.admin-login { display:grid; place-items:center; min-height:100svh; padding:30px; background:linear-gradient(135deg,#e6ece9 0%,#f7f5f0 55%,#e3e9ed 100%); }.admin-login > .system-brand { position:fixed; top:28px; left:34px; }.admin-login form { width:min(100%,420px); padding:37px; border-radius:16px; background:#fff; box-shadow:var(--shadow); }.admin-login .kicker { color:#4c9b68; }.admin-login h1 { margin:0; font-size:31px; }.admin-login form > p:not(.kicker):not(.form-message) { margin:14px 0 25px; color:var(--muted); font-size:14px; line-height:1.7; }.admin-login label,.settings-panel label,.credential-panel label { display:block; color:#475356; font-size:13px; font-weight:700; }.admin-login input,.settings-panel input,.settings-panel textarea,.credential-panel input { width:100%; margin-top:8px; border:1px solid #d8dfe0; border-radius:8px; color:var(--ink); background:#fff; }.admin-login input,.settings-panel input,.credential-panel input { height:47px; padding:0 13px; }.settings-panel textarea { padding:11px 13px; resize:vertical; }.admin-login button { width:100%; margin-top:18px; }.admin-shell { display:grid; grid-template-columns:246px 1fr; min-height:100svh; }.admin-sidebar { display:flex; flex-direction:column; padding:28px 18px; color:#fff; background:#1e2932; }.admin-sidebar .system-brand span { background:#79ba9a; color:#173f2a; }.admin-user { display:flex; gap:10px; align-items:center; margin:47px 7px 23px; }.admin-user i { width:31px; height:31px; border-radius:50%; background:linear-gradient(135deg,#eabf6e,#e18066); }.admin-user strong,.admin-user small { display:block; }.admin-user strong { font-size:13px; }.admin-user small { margin-top:2px; color:#8ea0a3; font-size:11px; }.sidebar-action { min-height:42px; padding:0 12px; border:0; border-radius:7px; color:#a6b3b5; background:transparent; text-align:left; font-size:14px; }.sidebar-action.active { color:#d8f2df; background:rgba(121,186,154,.14); }.sidebar-action:last-child { margin-top:auto; }.admin-main { width:min(1160px,100%); padding:46px clamp(28px,5vw,72px) 65px; }.admin-main > header { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:31px; }.admin-main header .kicker { color:#4c9b68; }.admin-main h1 { margin:0; font-size:37px; }.admin-main > header > p { max-width:390px; margin:0; color:var(--muted); font-size:14px; line-height:1.7; }.admin-grid { display:grid; grid-template-columns:1.12fr .88fr; gap:17px; }.admin-panel { padding:27px; border-radius:13px; background:#fff; box-shadow:0 1px 2px rgba(20,35,40,.03),0 8px 24px rgba(20,35,40,.05); }.panel-head { display:flex; justify-content:space-between; gap:20px; margin-bottom:23px; }.panel-head h2 { margin:0; font-size:20px; }.panel-head p { margin:5px 0 0; color:var(--muted); font-size:13px; }.settings-panel form { display:grid; gap:18px; }.settings-panel label small { display:block; margin-top:2px; color:#8b9698; font-size:11px; font-weight:500; }.settings-panel .admin-primary { justify-self:start; min-height:48px; }.admin-secondary { min-height:45px; padding:0 15px; border:1px solid #bfcbc8; border-radius:8px; color:#2f6e5e; background:#f3faf5; font-weight:700; }.credential-panel form { display:grid; gap:12px; }.rule-note { margin-top:32px; padding:15px; border-radius:8px; background:#f1f5f2; }.rule-note strong,.rule-note span { display:block; }.rule-note strong { color:#3b4849; font-size:13px; }.rule-note span { margin-top:3px; color:#6b7779; font-size:12px; }.grants-panel { margin-top:18px; }.grant-total { color:#667477; font-size:12px; }.grant-table { overflow:auto; }.grant-row { display:grid; grid-template-columns:1.15fr 1.25fr 1.25fr .65fr 58px; gap:13px; align-items:center; min-width:690px; padding:13px 0; border-top:1px solid #edf0f0; color:#637073; font-size:13px; }.grant-heading { padding-top:0; border-top:0; color:#9ba4a6; font-size:11px; }.grant-row strong { color:#344143; font-weight:650; }.grant-row button { min-height:30px; border:1px solid #d9e0e0; border-radius:6px; color:#516164; background:#fff; font-size:12px; }.status { display:inline-flex; width:max-content; padding:3px 7px; border-radius:99px; font-size:11px; }.status.active { color:#287257; background:#e9f7ed; }.status.expired { color:#a96a26; background:#fff2df; }.empty-record { padding:30px 0; color:var(--muted); font-size:13px; text-align:center; }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; transition-duration:.01ms !important; } }
@media (max-width:820px) { .gateway-page { grid-template-columns:1fr; }.gateway-story { min-height:510px; padding:25px 26px 28px; }.story-copy { margin:auto 0 65px; }.story-copy h1 { font-size:55px; }.constellation { right:-175px; top:8%; transform:scale(.73); transform-origin:top right; }.gateway-panel { padding:43px 24px 58px; }.unlock-card { padding-top:0; }.gateway-notes { margin-top:60px; }.career-topbar { height:60px; padding:0 18px; }.career-topbar-title { display:none; }.career-app { width:min(100% - 32px,600px); }.career-home { grid-template-columns:1fr; gap:38px; min-height:auto; padding:44px 0; }.career-visual { min-height:310px; }.visual-map { height:220px; }.career-overview { grid-template-columns:1fr; gap:24px; padding:42px 0; }.career-test { padding:27px 0 40px; }.question-meta small { display:none; }.career-question { padding:25px 20px; }.career-test footer span { display:none; }.work-style-card { grid-template-columns:1fr; padding:27px; }.type-orbit { transform:scale(.8); margin:-18px auto -24px; }.job-grid { grid-template-columns:1fr 1fr; }.career-score-card { grid-template-columns:1fr; gap:13px; }.career-report { padding:39px 0; }.admin-shell { grid-template-columns:1fr; }.admin-sidebar { display:none; }.admin-main { padding:34px 20px 55px; }.admin-main > header { display:block; }.admin-main > header > p { margin-top:10px; }.admin-grid { grid-template-columns:1fr; }.admin-login { padding:20px; }.admin-login > .system-brand { top:19px; left:20px; }.admin-login form { padding:27px; margin-top:38px; } }
@media (max-width:430px) { .story-copy h1 { font-size:48px; }.code-row { grid-template-columns:1fr; }.unlock-button { width:100%; }.job-grid { grid-template-columns:1fr; }.career-facts { gap:18px; }.career-score-card > div { grid-template-columns:44px 1fr 30px; }.work-style-card h2 { font-size:23px; } }