/* SimpleGP shared design tokens. Source of truth for simplegp-app and simplegp-site.
   shadcn/ui convention: HSL triplets consumed as hsl(var(--x)). */
:root{
  /* surfaces */
  --background:45 22% 94%;        /* #f4f2ec paper */
  --foreground:220 34% 7%;        /* #0b0f17 ink */
  --card:0 0% 100%;               /* #ffffff */
  --card-foreground:220 34% 7%;
  --popover:0 0% 100%;
  --popover-foreground:220 34% 7%;
  --muted:43 20% 90%;             /* #ebe8df */
  --muted-foreground:221 13% 33%; /* #4a5160 */
  --subtle-foreground:219 7% 57%; /* #8a909b */
  /* brand */
  --primary:220 34% 7%;           /* ink buttons */
  --primary-foreground:0 0% 100%;
  --accent:38 52% 47%;            /* #b8893a gold */
  --accent-light:40 69% 71%;      /* #e9c983 */
  --accent-text:37 59% 38%;       /* #9a6f28 gold on paper, AA at 14px+ semibold */
  --accent-foreground:36 63% 6%;  /* #1a1206 text on gold */
  --secondary:0 0% 100%;
  --secondary-foreground:220 34% 7%;
  /* lines */
  --border:220 33% 7% / .12;
  --input:220 33% 7% / .18;
  --ring:38 52% 47%;
  /* semantic */
  --success:151 49% 36%;          /* #2f8a5b */
  --success-bg:150 38% 92%;
  --warning:35 85% 40%;           /* #bc7a0f */
  --warning-bg:42 85% 92%;
  --destructive:9 49% 48%;        /* #b5503f */
  --destructive-bg:10 60% 94%;
  --destructive-foreground:0 0% 100%;
  --info:217 52% 42%;             /* #3361a3 */
  --info-bg:216 60% 94%;
  /* demo banner */
  --demo:38 52% 47%;
  --demo-bg:41 70% 90%;
  /* shape */
  --radius:10px;                  /* cards, inputs: rounded-lg */
  --radius-sm:6px; --radius-md:8px; --radius-xl:16px; --radius-pill:999px;
  /* elevation */
  --shadow-xs:0 1px 2px rgba(11,15,23,.05);
  --shadow-sm:0 1px 2px rgba(11,15,23,.04),0 2px 8px rgba(11,15,23,.05);
  --shadow-md:0 2px 4px rgba(11,15,23,.04),0 12px 32px rgba(11,15,23,.08);
  --shadow-lg:0 30px 80px rgba(11,15,23,.16);
  --shadow-gold:0 0 0 1px rgba(255,255,255,.2) inset,0 8px 30px rgba(216,178,106,.35);
  /* motion */
  --ease-out:cubic-bezier(.2,.8,.2,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --dur-fast:120ms; --dur:180ms; --dur-slow:280ms;
  /* type */
  --font-sans:Geist,Inter,system-ui,sans-serif;
  --font-mono:"Geist Mono",ui-monospace,monospace;
  --font-serif:"Instrument Serif",Georgia,serif; /* marketing display italics only */
}
.dark{
  --background:220 30% 6%;        /* #0b0e14 */
  --foreground:216 33% 95%;       /* #eef1f6 */
  --card:220 26% 9%;              /* #11151d */
  --card-foreground:216 33% 95%;
  --popover:220 26% 9%;
  --popover-foreground:216 33% 95%;
  --muted:220 20% 13%;
  --muted-foreground:219 11% 59%; /* #8b93a3 */
  --subtle-foreground:219 11% 40%;
  --primary:216 33% 95%;
  --primary-foreground:220 34% 7%;
  --accent:39 59% 63%;            /* #d8b26a */
  --accent-text:39 59% 63%;
  --border:0 0% 100% / .08;
  --input:0 0% 100% / .14;
  --ring:39 59% 63%;
  --success:151 45% 52%; --success-bg:151 40% 14%;
  --warning:38 80% 58%;  --warning-bg:38 60% 14%;
  --destructive:9 65% 62%; --destructive-bg:9 50% 15%;
  --info:216 70% 66%; --info-bg:216 45% 16%;
  --demo-bg:39 40% 15%;
}
@import url("https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&display=swap");
*{box-sizing:border-box;margin:0;padding:0}
body{background:hsl(var(--background));color:hsl(var(--foreground));font:14px/22px var(--font-sans);-webkit-font-smoothing:antialiased;font-feature-settings:"tnum","ss01";overflow-x:hidden}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--font-mono)}
.brand{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:18px;letter-spacing:-.045em}.brand b{font-weight:600;color:hsl(var(--accent-text))}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:var(--radius-pill);font:500 14px/1 var(--font-sans);border:1px solid hsl(var(--input));background:hsl(var(--card));color:hsl(var(--foreground));white-space:nowrap;transition:background var(--dur) var(--ease-out)}
.btn.p{background:hsl(var(--primary));color:hsl(var(--primary-foreground));border-color:transparent}
.btn.g{background:linear-gradient(180deg,#e9c983,#b8893a);color:#1a1206;border:0;box-shadow:var(--shadow-gold)}
.btn.gh{background:transparent;border-color:transparent}
.btn.sm{height:32px;padding:0 12px;font-size:13px}
.btn.w{width:100%;height:44px}
.lbl{display:block;font-size:13px;font-weight:500;margin-bottom:6px}
.inp{width:100%;height:44px;border:1px solid hsl(var(--input));border-radius:var(--radius);background:#fff;padding:0 14px;font:15px var(--font-sans);color:hsl(var(--foreground))}
.inp.f{border-color:hsl(var(--accent));box-shadow:0 0 0 3px hsl(var(--accent)/.18)}
select.inp{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%238a909b' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 14px center}
.hint{font-size:12.5px;color:hsl(var(--subtle-foreground));margin-top:6px}
.field{margin-bottom:16px}
.card{background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}
.eb{font:500 11px/16px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:hsl(var(--accent-text))}
.or{display:flex;align-items:center;gap:12px;color:hsl(var(--subtle-foreground));font-size:12px;margin:18px 0}.or:before,.or:after{content:"";flex:1;height:1px;background:hsl(var(--border))}
.badge{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:500}
.b-ok{background:hsl(var(--success-bg));color:hsl(var(--success))}.b-warn{background:hsl(var(--warning-bg));color:hsl(var(--warning))}.b-err{background:hsl(var(--destructive-bg));color:hsl(var(--destructive))}.b-info{background:hsl(var(--info-bg));color:hsl(var(--info))}.b-mut{background:hsl(var(--muted));color:hsl(var(--muted-foreground))}
.alert{display:flex;gap:12px;padding:14px 16px;border-radius:var(--radius);font-size:14px;line-height:21px}
.alert.err{background:hsl(var(--destructive-bg));color:#6e2a1f;border:1px solid hsl(var(--destructive)/.25)}
.sample{font:500 10.5px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:hsl(var(--subtle-foreground));border:1px dashed hsl(var(--input));border-radius:999px;padding:5px 8px;display:inline-block}
/* auth split */
.auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:100vh}
.auth .l{display:flex;flex-direction:column;padding:28px 56px}
.auth .form{width:100%;max-width:400px;margin:auto}
.auth h1{font-size:34px;line-height:40px;letter-spacing:-.035em;font-weight:600;margin:14px 0 10px}
.auth h1 em{font-family:var(--font-serif);font-weight:400;font-style:italic;letter-spacing:-.01em}
.auth .sub{color:hsl(var(--muted-foreground));font-size:15px;line-height:24px;margin-bottom:26px}
.auth .foot{font-size:12.5px;color:hsl(var(--subtle-foreground));display:flex;justify-content:space-between;gap:12px}
.auth .r{background:#0b0f17;color:#eef1f6;position:relative;overflow:hidden;padding:56px;display:flex;flex-direction:column;justify-content:center}
.auth .r:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 60% 40%,rgba(32,60,120,.55),transparent 60%),radial-gradient(ellipse at 40% 70%,rgba(216,178,106,.18),transparent 50%)}
.auth .r>*{position:relative}
.quote{font-family:var(--font-serif);font-size:34px;line-height:40px;letter-spacing:-.01em;max-width:460px}
.quote em{color:#d8b26a}
.small{font-size:13px;color:hsl(var(--subtle-foreground))}
.top{display:flex;justify-content:space-between;align-items:center}
.ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:hsl(var(--demo-bg));color:hsl(var(--accent-text))}
.ic.err{background:hsl(var(--destructive-bg));color:hsl(var(--destructive))}
.ic.ok{background:hsl(var(--success-bg));color:hsl(var(--success))}
.gbtn svg{flex:none}
@media(max-width:760px){.auth{grid-template-columns:1fr}.auth .r{display:none}.auth .l{padding:18px 20px 24px}.auth h1{font-size:30px;line-height:36px}.auth .form{margin:36px 0 auto}.auth .foot{flex-direction:column;margin-top:40px}}
/* app shell */
.shell{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.side{border-right:1px solid hsl(var(--border));padding:18px 12px;background:#efece4}
.ws{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;border:1px solid hsl(var(--border));background:#fff;margin:14px 0 18px}
.ws .av{width:28px;height:28px;border-radius:7px;background:#e9e3d2;display:grid;place-items:center;font:600 12px var(--font-sans);color:#9a6f28}
.ws small{display:block;font-size:11.5px;color:hsl(var(--subtle-foreground));line-height:14px}
.ws div{font-size:13px;font-weight:600;line-height:16px}
.nav a{display:flex;align-items:center;gap:10px;height:34px;padding:0 10px;border-radius:8px;font-size:13.5px;color:hsl(var(--muted-foreground))}
.nav a.on{background:#fff;color:hsl(var(--foreground));font-weight:500;box-shadow:var(--shadow-xs)}
.nav a i{width:16px;height:16px;border:1.5px solid currentColor;border-radius:4px;opacity:.6}
.nav h6{font:500 10.5px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:hsl(var(--subtle-foreground));padding:16px 10px 6px}
.main{min-width:0}
.bar{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 28px;border-bottom:1px solid hsl(var(--border))}
.bar h2{font-size:17px;font-weight:600;letter-spacing:-.015em}
.content{padding:28px}
.demo{display:flex;align-items:center;gap:12px;padding:10px 28px;background:hsl(var(--demo-bg));border-bottom:1px solid hsl(var(--accent)/.35);font-size:13.5px;color:#4b3613}
.demo b{font-weight:600}.demo .sp{flex:1}
.demo .dot{width:8px;height:8px;border-radius:50%;background:#b8893a;box-shadow:0 0 0 3px rgba(184,137,58,.2);flex:none}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kpi{padding:16px 18px}.kpi small{font-size:12px;color:hsl(var(--muted-foreground))}.kpi div{font-size:24px;font-weight:600;letter-spacing:-.02em;margin-top:4px}.kpi span{font-size:12px}
.grid2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:14px;margin-top:14px}
.ch{padding:16px 18px;border-bottom:1px solid hsl(var(--border));display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:14px}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{text-align:left;font:500 11px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:hsl(var(--subtle-foreground));padding:10px 18px;border-bottom:1px solid hsl(var(--border))}
td{padding:11px 18px;border-bottom:1px solid hsl(var(--border))}tr:last-child td{border:0}
.num{text-align:right;font-variant-numeric:tabular-nums}
.pos{color:hsl(var(--success))}.neg{color:hsl(var(--destructive))}
.ro{opacity:.45;cursor:not-allowed}
.empty{text-align:center;padding:40px 28px}
.empty .ill{width:56px;height:56px;margin:0 auto 14px;border-radius:14px;background:#efe9da;display:grid;place-items:center;color:#9a6f28}
.empty h3{font-size:16px;font-weight:600;letter-spacing:-.01em;margin-bottom:6px}
.empty p{color:hsl(var(--muted-foreground));font-size:13.5px;line-height:21px;max-width:300px;margin:0 auto 16px}
.empty .acts{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.mtop{display:none}
@media(max-width:760px){.shell{grid-template-columns:1fr}.side{display:none}.mtop{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid hsl(var(--border))}.bar{padding:0 16px;height:52px}.content{padding:16px}.demo{padding:10px 16px;flex-wrap:wrap;gap:8px 10px}.demo .sp,.demo .dot{display:none}.demo>span:nth-child(2){flex-basis:100%}.demo .btn{flex:1}.kpis{grid-template-columns:1fr 1fr;gap:10px}.kpi div{font-size:20px}.grid2{grid-template-columns:1fr}.hm{display:none}th,td{padding:10px 12px}}
/* onboarding */
.ob{max-width:560px;margin:0 auto;padding:28px 20px 60px}
.steps{display:flex;gap:6px;margin:34px 0 26px}.steps i{flex:1;height:3px;border-radius:2px;background:hsl(var(--muted))}.steps i.on{background:#b8893a}
.ob h1{font-size:30px;line-height:36px;letter-spacing:-.03em;font-weight:600;margin:10px 0 8px}
.ob .sub{color:hsl(var(--muted-foreground));font-size:15px;line-height:24px;margin-bottom:24px}
.opt{display:flex;gap:14px;padding:16px;border:1px solid hsl(var(--input));border-radius:12px;background:#fff;margin-bottom:10px}
.opt.on{border-color:#b8893a;box-shadow:0 0 0 3px rgba(184,137,58,.15)}
.opt .rad{width:18px;height:18px;border-radius:50%;border:1.5px solid hsl(var(--input));flex:none;margin-top:2px}.opt.on .rad{border:5px solid #b8893a}
.opt b{display:block;font-weight:600;font-size:14.5px}.opt span{font-size:13px;color:hsl(var(--muted-foreground))}
.row{display:flex;gap:10px}.row>*{min-width:0}
.ftr{display:flex;justify-content:space-between;align-items:center;margin-top:26px;gap:10px}
@media(max-width:760px){.ob h1{font-size:26px;line-height:32px}.row.st{flex-direction:column}}
.inp.ta{height:112px;padding:12px 14px;line-height:22px;resize:vertical;font-size:15px}
[hidden]{display:none!important}