/*
 * ClickTech Account visual system.
 * Exact reference colors verified from deployed clicktech.cc CSS (2026-10-30):
 * background #070c14; surface #101827; text #eff4ff; accent #397bf7.
 * UI-only: intentionally does not change registration, session, trial or admin API.
 */
:root {
  color-scheme:dark;
  --green:#397bf7;
  --muted:#a3b2cc;
  --line:rgba(144,176,232,.17);
  --paper:#101827;
  --orange:#eab775;
  color:#eff4ff;
  background:#070c14;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
}
html{-webkit-text-size-adjust:100%}
body{background:radial-gradient(ellipse 56% 40% at 50% -12%,#205fd62b 0%,transparent 85%),#070c14;color:#eff4ff;min-width:320px}
a{color:#95c2ff}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #9cc5ff;outline-offset:3px}
:focus-visible{scroll-margin-top:12px}
.skip{background:#101827;color:#fff}
h1,h2,h3{color:#f3f7ff}
small,.fineprint,.muted{color:#a3b2cc}
.eyebrow{color:#8fbaff}
.topbar{height:72px;background:#080e19;border-color:#22324a;padding:0 clamp(18px,4.5vw,66px)}
.brand{font-weight:770;font-size:1.35rem;color:#f1f6ff;letter-spacing:-.05em}
.brand-emblem{height:32px;width:32px;flex:0 0 32px;position:relative;display:inline-block;background:conic-gradient(from -50deg,transparent 0deg 48deg,#2364eb 48deg 285deg,#74b1ff 320deg,transparent 353deg);border-radius:50%}
.brand-emblem::after{content:'';position:absolute;inset:8px;border-radius:50%;background:#090f19}
.brand-emblem>span{position:absolute;display:block;width:12px;height:10px;background:#090f19;right:-1px;top:13px;transform:rotate(-8deg)}
@media(max-width:625px){.brand-emblem{height:28px;width:28px;flex-basis:28px}.brand-emblem::after{inset:7px}}
.brand>span:not(.brand-emblem){color:#9db2d2;border-left:1px solid #354866}
.header-tools>.badge{display:none}
.badge{background:#1a3260;color:#c5ddff;border-radius:6px}
.badge.warning{color:#f4c996;background:#3a291f}
.locale-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px clamp(18px,4.5vw,66px);background:#0b1321;border-bottom:1px solid #263850}
.locale-label{display:flex;align-items:center;gap:8px;color:#a9bfdc;font-size:.78rem;font-weight:650;white-space:nowrap}
.locale-label svg{color:#8db6fa}
.locale-label .short{display:none}
.locale-buttons{display:flex;gap:3px;align-items:center;padding:4px;border-radius:11px;border:1px solid #2b4060;background:#111c2e}
.locale-choice{min-height:37px;padding:8px 13px;border-radius:7px;border:1px solid transparent;background:transparent;color:#b9c9e0;font-size:.78rem;font-weight:650;white-space:nowrap}
.locale-choice[aria-pressed=true]{background:linear-gradient(140deg,#397bf7,#2264e0);color:white;border-color:#679ff854;box-shadow:0 2px 9px #1f5fd04b}
.locale-choice:hover:not([aria-pressed=true]){background:#1a2d49;color:#e9f3ff}
.language-hidden{position:absolute!important;width:1px!important;height:1px!important;clip-path:inset(50%);overflow:hidden;opacity:0;pointer-events:none;tabindex:-1}
.auth-layout{min-height:calc(100vh - 127px);grid-template-columns: minmax(0,.92fr) minmax(0,1fr);gap:22px;padding:25px;max-width:1400px;margin:0 auto}
.hero{margin:0;min-height:620px;padding:56px clamp(35px,5vw,75px);border-radius:20px;background:radial-gradient(circle at 80% 66%,#2356b04a,transparent 45%),linear-gradient(148deg,#111e38,#0a1322 80%);border:1px solid #2d42648c;box-shadow:0 23px 50px #0000003b}
.hero .eyebrow{color:#90baff}
.hero h1{font-size:clamp(2.8rem,4.1vw,4.8rem);font-weight:630;line-height:1.13;color:#f2f7ff}
.hero-lead{color:#b4c7e1}
.orbit:before,.orbit:after{border-color:#6a9ce95c}
.orbit-core{background:linear-gradient(135deg,#e1edff,#a7caff);color:#0c2864;border:1px solid #dbeaff80;box-shadow:0 9px 28px #06102ba8,0 0 70px #397bf72c}
.orbit-pill{background:#17305a;color:#d9e8ff;border-color:#508ae0}
.orbit-dot{background:#82b4ff;border-color:#31639e}
.hero-bottom{border-top-color:#55749a6c}
.hero-bottom strong{color:#eff6ff}
.hero-bottom p{color:#aac3df}
.auth-panel{padding:18px 3%;display:flex;justify-content:center;align-items:center}
.auth-content{max-width:515px;width:100%;padding:37px 42px 38px;border:1px solid #293b56;border-radius:20px;background:linear-gradient(155deg,#111d2e,#0e1727 80%);box-shadow:0 20px 48px #00000052,inset 0 1px #526e981b}
.auth-content h2{font-weight:690;font-size:2.05rem;line-height:1.22;color:#eff5ff}
.auth-content>.muted{color:#a8b9d4}
.notice{background:#272419;color:#e9cda7;border-color:#645136;border-radius:10px}
.notice strong{color:#f5dcb7}
.notice p{color:#d3b98f}
.notice>span{border-color:#be995e;color:#f5cb8f}
label{color:#dce7f7}
input,textarea{min-height:49px;border:1px solid #364865;background:#0b1625;border-radius:9px;padding:11px 13px;color:#f3f7ff;font-size:16px}
input::placeholder,textarea::placeholder{color:#7e91ac}
input:focus,textarea:focus{outline:none;border-color:#70a5ff;box-shadow:0 0 0 3px #397bf729}
.primary{background:linear-gradient(114deg,#397bf7,#205fd6);border:1px solid #528ef4;color:#fff;border-radius:9px;box-shadow:0 8px 16px #1e5cca35}
.primary:hover{background:linear-gradient(114deg,#4789ff,#2964db)}
.secondary{border-color:#355378;color:#c1dcff;background:#14243b;border-radius:9px}
.secondary:hover:not(:disabled){background:#1d3554}
.forgot,.text-link,.text-button{color:#a1c9ff}
.demo-links{border-top-color:#2a3a53}
.switch-auth{color:#aabbd2}
.policy{border-top-color:#2b3c54}
.policy [aria-disabled=true]{color:#9bb8da}
#form-result,#copy-result{color:#f1c095}
.journey{min-height:calc(100vh - 127px);padding:44px 16px}
.journey-card,.card{background:#111b2b;border:1px solid #2b3f5e;box-shadow:0 12px 30px #0000002b}
.journey-card{border-radius:18px}
.journey-card .muted,.card p{color:#a9b9d1}
.state-icon{background:#19365d;border-color:#345b95;color:#b5d3ff}
.state-icon.success{background:#1d3d37;border-color:#357465;color:#a0e4c1}
.mail{background:#0d192a;border-color:#324966}
.mail-meta{border-bottom-color:#385276}
.mail p{color:#b8c8e2}
.workspace{min-height:calc(100vh - 127px)}
.sidebar{background:#0c1524;border-right:1px solid #273954}
.sidebar nav a{color:#a9bcd7}
.sidebar nav a span{color:#7e99ba}
.sidebar nav a[aria-current]{background:#18396c;color:#e2eeff}
.sidebar nav a:hover{background:#172b49}
.sidebar-bottom{border-top-color:#283b56}
.avatar,.product-symbol{background:#1a3c76;color:#cce3ff}
.product-symbol.pale{background:#2d2b3a;color:#e0cff1}
.card{border-radius:12px}
.card-icon{color:#79abf7}
.card a{color:#9bc4ff}
.trial-card{background:radial-gradient(circle at 88% 12%,#3a81f72b,transparent 46%),linear-gradient(133deg,#1a3d83,#101e42 86%);border:1px solid #3f65a5;color:#eff5ff}
.trial-card .eyebrow{color:#bed5ff}
.trial-card p{color:#c3d3ee}
.trial-meta small{color:#b1c5e9}
.trial-art span{color:#dbeaff}
.trial-art small{color:#b4caff}
.profile-line{border-top-color:#5f7ba5;color:#c6dbff}
.profile-line code{color:#d8e9ff}
.slim-card{background:#122239;border-color:#2d4262}
.slim-card p{color:#aabbd2}
.gate-list>div{border-bottom-color:#2b3d55}
.gate-number{color:#88a7d2}
.workspace-footer{border-top:1px solid #2a3b53;color:#92a5c3}
.device-empty{color:#d4e5fc}
.admin-tile:hover{border-color:#4b81d1}
th,td{border-bottom:1px solid #2b3d57}
table{color:#eff4ff}
.table-scroll{border:1px solid #273d5d;border-radius:10px}
.secret-display{color:#dceaff}
@media(max-width:900px){
 .auth-layout{display:block;min-height:auto;padding:0}
 .hero{display:none}
 .auth-panel{padding:24px 16px 40px}
 .auth-content{max-width:560px}
}
@media(max-width:760px){
 .topbar{height:64px;min-height:64px;padding:10px 17px;gap:8px}
 .brand{font-size:1.25rem}
 .brand>span:not(.brand-emblem){margin-left:2px;padding-left:9px;font-size:.67rem}
 .locale-bar{padding:9px 16px;gap:6px}
 .locale-label{font-size:.73rem;gap:5px}
 .locale-label .long{display:none}
 .locale-label .short{display:inline}
 .locale-buttons{padding:3px}
 .locale-choice{padding:8px 10px;font-size:.76rem}
 .auth-panel{padding:17px 13px 31px}
 .auth-content{max-width:560px;padding:25px 22px 29px;border-radius:17px}
 .auth-content h2{font-size:1.83rem}
 .auth-content .notice{margin:16px 0}
 .journey{padding:22px 13px}
 .journey-card{padding:28px 22px}
 .sidebar{border-right:0;border-bottom:1px solid #2b3c55}
 .workspace-main{padding:26px 18px}
 .page-heading h1{font-size:1.94rem}
 .card-grid{gap:15px}
 .stats{gap:12px}
}
@media(max-width:355px){
 .locale-bar{padding:8px 11px}
 .locale-choice{padding:7px 7px;font-size:.71rem}
 .auth-content{padding:22px 18px}
}
@media(forced-colors:active){.primary,.badge,.notice,.card{border:1px solid CanvasText}}