:root{--brand-h: 152;--neutral-h: 256;--bg: oklch(.15 .013 var(--neutral-h));--bg-2: oklch(.132 .013 var(--neutral-h));--surface: oklch(.196 .015 var(--neutral-h));--surface-2: oklch(.232 .017 var(--neutral-h));--surface-3: oklch(.27 .018 var(--neutral-h));--border: oklch(.3 .02 var(--neutral-h));--border-soft: oklch(.255 .018 var(--neutral-h));--text: oklch(.97 .004 var(--neutral-h));--muted: oklch(.705 .012 var(--neutral-h));--faint: oklch(.56 .013 var(--neutral-h));--primary: oklch(.82 .17 var(--brand-h));--primary-dim: oklch(.72 .15 var(--brand-h));--primary-soft: color-mix(in oklab, var(--primary) 15%, transparent);--on-primary: oklch(.16 .02 var(--neutral-h));--gold: oklch(.82 .15 86);--gold-dim: oklch(.72 .14 86);--gold-soft: color-mix(in oklab, var(--gold) 16%, transparent);--on-gold: oklch(.16 .02 var(--neutral-h));--success: oklch(.8 .15 152);--success-soft: color-mix(in oklab, var(--success) 16%, transparent);--warning: oklch(.83 .15 78);--warning-soft: color-mix(in oklab, var(--warning) 16%, transparent);--danger: oklch(.7 .18 25);--danger-soft: color-mix(in oklab, var(--danger) 16%, transparent);--info: oklch(.74 .13 240);--info-soft: color-mix(in oklab, var(--info) 16%, transparent);--ring: color-mix(in oklab, var(--primary) 55%, transparent);--shadow-sm: 0 1px 2px oklch(0 0 0 / .4);--shadow-md: 0 8px 24px -12px oklch(0 0 0 / .6);--shadow-lg: 0 24px 60px -24px oklch(0 0 0 / .7);--shadow-pop: 0 16px 40px -12px oklch(0 0 0 / .65);--font-display: "Space Grotesk", system-ui, sans-serif;--font-body: "Manrope", system-ui, sans-serif;--font-mono: "Space Mono", ui-monospace, monospace;--r-xs: 7px;--r-sm: 10px;--r-md: 14px;--r-lg: 20px;--r-xl: 28px;--r-pill: 999px;--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-5: 20px;--s-6: 24px;--s-7: 32px;--s-8: 40px;--s-9: 48px;--s-10: 64px;--s-11: 80px;--s-12: 96px;--maxw: 1200px;color-scheme:dark}[data-theme=light]{--bg: oklch(.975 .004 var(--neutral-h));--bg-2: oklch(.955 .005 var(--neutral-h));--surface: oklch(1 0 0);--surface-2: oklch(.975 .004 var(--neutral-h));--surface-3: oklch(.945 .006 var(--neutral-h));--border: oklch(.905 .006 var(--neutral-h));--border-soft: oklch(.935 .005 var(--neutral-h));--text: oklch(.235 .018 var(--neutral-h));--muted: oklch(.47 .018 var(--neutral-h));--faint: oklch(.61 .016 var(--neutral-h));--primary: oklch(.605 .16 var(--brand-h));--primary-dim: oklch(.54 .15 var(--brand-h));--primary-soft: color-mix(in oklab, var(--primary) 12%, transparent);--on-primary: oklch(.99 0 0);--gold: oklch(.66 .13 80);--gold-dim: oklch(.58 .12 80);--gold-soft: color-mix(in oklab, var(--gold) 16%, transparent);--on-gold: oklch(.99 0 0);--success: oklch(.58 .15 152);--success-soft: color-mix(in oklab, var(--success) 14%, transparent);--warning: oklch(.66 .15 70);--warning-soft: color-mix(in oklab, var(--warning) 16%, transparent);--danger: oklch(.58 .2 25);--danger-soft: color-mix(in oklab, var(--danger) 12%, transparent);--info: oklch(.58 .15 245);--info-soft: color-mix(in oklab, var(--info) 12%, transparent);--shadow-sm: 0 1px 2px oklch(.5 .02 256 / .1);--shadow-md: 0 8px 24px -14px oklch(.4 .03 256 / .3);--shadow-lg: 0 24px 60px -28px oklch(.4 .03 256 / .3);--shadow-pop: 0 16px 40px -14px oklch(.4 .03 256 / .22);color-scheme:light}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}::selection{background:var(--primary-soft)}h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.08;letter-spacing:-.02em}.mono{font-family:var(--font-mono)}.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--primary);display:inline-flex;align-items:center;gap:8px}.eyebrow:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--primary);box-shadow:0 0 10px var(--primary)}.btn{font-family:var(--font-body);font-weight:700;font-size:14px;line-height:1;border:1px solid transparent;border-radius:var(--r-pill);padding:11px 18px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;transition:transform .14s ease,background .18s ease,box-shadow .18s ease,border-color .18s ease,color .18s ease}.btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--ring)}.btn svg{width:16px;height:16px}.btn-primary{background:var(--primary);color:var(--on-primary);box-shadow:0 8px 22px -10px var(--primary)}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 14px 30px -10px var(--primary)}.btn-ghost{background:transparent;color:var(--text);border-color:var(--border)}.btn-ghost:hover{border-color:var(--primary);color:var(--primary)}.btn-soft{background:var(--surface-2);color:var(--text);border-color:var(--border-soft)}.btn-soft:hover{background:var(--surface-3)}.btn-danger{background:var(--danger-soft);color:var(--danger);border-color:color-mix(in oklab,var(--danger) 35%,transparent)}.btn-danger:hover{background:color-mix(in oklab,var(--danger) 22%,transparent)}.btn-sm{padding:8px 13px;font-size:13px}.btn-lg{padding:14px 24px;font-size:15px}.btn-icon{padding:9px;border-radius:var(--r-sm)}.btn-block{width:100%;justify-content:center}.field{display:flex;flex-direction:column;gap:7px}.label{font-size:12.5px;font-weight:600;color:var(--muted);letter-spacing:.01em;display:flex;align-items:center;gap:6px}.label .req{color:var(--danger)}.hint{font-size:12px;color:var(--faint)}.input,.select,.textarea{font-family:var(--font-body);font-size:14px;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-sm);padding:11px 13px;width:100%;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}.input::placeholder,.textarea::placeholder{color:var(--faint)}.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--ring)}.textarea{resize:vertical;min-height:88px}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:38px;cursor:pointer}.input-group{position:relative;display:flex;align-items:center}.input-group .ico{position:absolute;left:12px;color:var(--faint);width:16px;height:16px;pointer-events:none}.input-group .input{padding-left:36px}.switch{position:relative;display:inline-flex;width:44px;height:25px;flex:0 0 auto;cursor:pointer}.switch input{position:absolute;opacity:0;width:0;height:0}.switch .track{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--surface-3);border:1px solid var(--border);border-radius:999px;transition:background .18s}.switch .thumb{position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:var(--muted);transition:transform .18s,background .18s}.switch input:checked+.track{background:var(--primary-soft);border-color:var(--primary)}.switch input:checked+.track .thumb{transform:translate(19px);background:var(--primary)}.segment{display:inline-flex;background:var(--surface-2);border:1px solid var(--border-soft);border-radius:var(--r-sm);padding:3px;gap:3px}.segment button{font-family:var(--font-body);font-size:13px;font-weight:600;border:none;background:transparent;color:var(--muted);padding:7px 14px;border-radius:calc(var(--r-sm) - 3px);cursor:pointer;transition:all .15s}.segment button[aria-selected=true]{background:var(--surface);color:var(--text);box-shadow:var(--shadow-sm)}.badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:4px 9px;border-radius:var(--r-pill);border:1px solid transparent}.badge:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.badge-success{color:var(--success);background:var(--success-soft);border-color:color-mix(in oklab,var(--success) 30%,transparent)}.badge-warning{color:var(--warning);background:var(--warning-soft);border-color:color-mix(in oklab,var(--warning) 30%,transparent)}.badge-danger{color:var(--danger);background:var(--danger-soft);border-color:color-mix(in oklab,var(--danger) 30%,transparent)}.badge-info{color:var(--info);background:var(--info-soft);border-color:color-mix(in oklab,var(--info) 30%,transparent)}.badge-neutral{color:var(--muted);background:var(--surface-2);border-color:var(--border-soft)}.badge-plain:before{display:none}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}.card-pad{padding:var(--s-6)}.table-wrap{width:100%;overflow-x:auto}table.data{width:100%;border-collapse:collapse;font-size:14px}table.data thead th{text-align:left;font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:12px 16px;border-bottom:1px solid var(--border);white-space:nowrap}table.data tbody td{padding:14px 16px;border-bottom:1px solid var(--border-soft);vertical-align:middle}table.data tbody tr{transition:background .12s}table.data tbody tr:hover{background:var(--surface-2)}table.data tbody tr:last-child td{border-bottom:none}.avatar{width:36px;height:36px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--on-primary);background:linear-gradient(145deg,var(--primary),var(--primary-dim))}.avatar-sm{width:28px;height:28px;font-size:11px}.avatar-lg{width:64px;height:64px;font-size:22px}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:var(--border);border-radius:999px;border:3px solid transparent;background-clip:content-box}*::-webkit-scrollbar-thumb:hover{background:var(--surface-3);background-clip:content-box}@keyframes rise{0%{transform:translateY(14px)}to{transform:none}}@keyframes fade{0%{opacity:0}to{opacity:1}}.reveal{animation:rise .6s cubic-bezier(.2,.7,.2,1) both}@media (prefers-reduced-motion: reduce){.reveal{animation:none}}.login-page{min-height:100vh;display:grid;grid-template-columns:1.05fr 1fr}.brandside{position:relative;overflow:hidden;padding:48px;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(120% 90% at 0% 0%,color-mix(in oklab,var(--primary) 16%,var(--bg-2)),var(--bg-2) 60%);border-right:1px solid var(--border-soft)}.brandside .glow{position:absolute;bottom:-200px;right:-120px;width:520px;height:520px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in oklab,var(--gold) 18%,transparent),transparent 70%);filter:blur(20px)}.bs-top{display:flex;align-items:center;gap:12px;position:relative;z-index:1}.bs-top .mark{width:40px;height:40px;border-radius:11px;background:linear-gradient(145deg,var(--primary),var(--primary-dim));display:grid;place-items:center;position:relative;box-shadow:0 8px 20px -8px var(--primary)}.bs-top .mark:after{content:"";width:15px;height:15px;border:3px solid var(--on-primary);border-radius:3px;transform:rotate(45deg)}.bs-top b{font-family:var(--font-display);font-weight:700;font-size:22px}.bs-mid{position:relative;z-index:1;max-width:24em}.bs-mid .eyebrow{margin-bottom:18px}.bs-mid h1{font-family:var(--font-display);font-weight:600;font-size:clamp(30px,3.4vw,44px);line-height:1.05;letter-spacing:-.02em}.bs-mid p{color:var(--muted);margin-top:16px;font-size:16px}.bs-foot{position:relative;z-index:1;font-family:var(--font-mono);font-size:12px;color:var(--faint)}.bs-card{position:relative;z-index:1;margin-top:26px;background:color-mix(in oklab,var(--surface) 70%,transparent);border:1px solid var(--border);border-radius:var(--r-lg);padding:18px;display:flex;gap:14px;align-items:center;max-width:26em}.bs-card .kanji{width:44px;height:44px;border-radius:12px;flex:0 0 auto;background:var(--gold-soft);color:var(--gold);display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:22px;border:1px solid color-mix(in oklab,var(--gold) 35%,transparent)}.bs-card div b{font-size:14px}.bs-card div span{display:block;font-size:12.5px;color:var(--faint);margin-top:2px}.formside{display:grid;place-items:center;padding:40px}.authcard{width:100%;max-width:400px}.authcard>.eyebrow{margin-bottom:14px}.authcard h2{font-family:var(--font-display);font-weight:600;font-size:27px;letter-spacing:-.02em}.authcard .lead{color:var(--muted);font-size:14.5px;margin-top:8px}.roleseg{display:flex;gap:8px;margin:24px 0 22px;background:var(--surface-2);border:1px solid var(--border-soft);border-radius:var(--r-md);padding:4px}.roleseg button{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;border:none;background:transparent;color:var(--muted);font-family:var(--font-body);font-weight:600;font-size:13.5px;border-radius:calc(var(--r-md) - 4px);cursor:pointer;transition:all .15s}.roleseg button svg{width:16px;height:16px}.roleseg button[aria-selected=true]{background:var(--surface);color:var(--text);box-shadow:var(--shadow-sm)}.authform{display:flex;flex-direction:column;gap:16px}.authform .rowbtw{display:flex;align-items:center;justify-content:space-between}.authform .rowbtw a{font-size:13px;color:var(--primary);font-weight:600;cursor:pointer}.authform .remember{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--muted);cursor:pointer}.authform .btn-lg{width:100%;justify-content:center;padding:14px;font-size:15px;margin-top:4px}.divider{display:flex;align-items:center;gap:12px;color:var(--faint);font-size:12px;font-family:var(--font-mono);margin:4px 0}.divider:before,.divider:after{content:"";height:1px;background:var(--border-soft);flex:1}.btn-oauth{width:100%;justify-content:center;gap:10px}.switchline{text-align:center;font-size:13.5px;color:var(--muted);margin-top:22px}.switchline a{color:var(--primary);font-weight:700;cursor:pointer}.state{animation:rise .35s cubic-bezier(.2,.7,.2,1) both}.err{color:var(--danger);background:var(--danger-soft);border:1px solid color-mix(in oklab,var(--danger) 30%,transparent);font-size:13px;padding:9px 12px;border-radius:var(--r-sm)}.sent-ico{width:60px;height:60px;border-radius:16px;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center;margin-bottom:18px}.sent-ico svg{width:28px;height:28px}.back-auth{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;margin-top:20px}.back-auth svg{width:15px;height:15px}.toplink{position:fixed;top:22px;right:26px;font-size:13.5px;color:var(--muted);font-weight:600;display:inline-flex;align-items:center;gap:6px}.toplink:hover{color:var(--text)}.toplink svg{width:15px;height:15px}@media (max-width: 860px){.login-page{grid-template-columns:1fr}.brandside{display:none}.formside{padding:28px 22px;align-content:center}.toplink{color:var(--faint)}}
