:root {
  --bg-base:#08090C; --bg-sunken:#0B0D11; --surface:#111318; --surface-2:#171A21;
  --surface-3:#1E222B; --surface-glass:rgba(17,19,24,0.72);
  --hairline:rgba(255,255,255,0.07); --hairline-strong:rgba(255,255,255,0.12); --hairline-inset:rgba(255,255,255,0.04);
  --text-primary:#F4F6FB; --text-secondary:#9BA3B4; --text-tertiary:#5E6677; --text-disabled:#3A404D;
  --accent:#6E8BFF; --accent-hover:#88A0FF; --accent-press:#5A78F0;
  --accent-soft:rgba(110,139,255,0.14); --accent-glow:rgba(110,139,255,0.45);
  --accent-gradient:linear-gradient(135deg,#7C8CFF 0%,#6E8BFF 45%,#8B6CFF 100%);
  --accent-gradient-radial:radial-gradient(120% 120% at 50% 0%,#8B6CFF 0%,#6E8BFF 40%,transparent 70%);
  --status-active:#34D399; --status-active-soft:rgba(52,211,153,0.13);
  --status-planning:#FBBF55; --status-planning-soft:rgba(251,191,85,0.13);
  --status-blocked:#F2545B; --status-blocked-soft:rgba(242,84,91,0.13);
  --status-done:#6E8BFF; --status-done-soft:rgba(110,139,255,0.13);
  --status-paused:#8A93A6; --status-paused-soft:rgba(138,147,166,0.13);
  --font-sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,monospace;
  --fs-display:34px; --fs-title:22px; --fs-h2:17px; --fs-body:15px; --fs-sub:13px; --fs-caption:11px;
  --tracking-caption:0.04em; --tracking-tight:-0.014em;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px;
  --r-xs:6px; --r-sm:10px; --r-md:14px; --r-lg:18px; --r-xl:24px; --r-pill:999px;
  --e-1:0 1px 2px rgba(0,0,0,.40); --e-2:0 4px 12px rgba(0,0,0,.45),0 1px 2px rgba(0,0,0,.30);
  --e-3:0 12px 32px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.35); --e-4:0 24px 64px rgba(0,0,0,.65),0 8px 24px rgba(0,0,0,.45);
  --glow-accent:0 0 0 1px var(--accent-glow),0 8px 28px var(--accent-glow);
  --inset-top:inset 0 1px 0 0 var(--hairline-inset);
  --blur-chrome:blur(24px) saturate(180%); --blur-modal:blur(40px) saturate(160%);
  --dur-1:120ms; --dur-2:220ms; --dur-3:340ms;
  --ease-out:cubic-bezier(0.22,0.61,0.36,1); --ease-spring:cubic-bezier(0.34,1.56,0.64,1); --ease-snappy:cubic-bezier(0.16,1,0.3,1);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;background:var(--bg-base);color:var(--text-primary);
  font:var(--fw-body)/21px var(--font-sans);font-size:var(--fs-body);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;letter-spacing:var(--tracking-tight);
  background-image:radial-gradient(120% 60% at 50% -10%,rgba(110,139,255,0.10),transparent 60%);background-attachment:fixed;}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.app{min-height:100dvh;position:relative;z-index:2;}

.header{position:sticky;top:0;z-index:60;height:calc(52px + env(safe-area-inset-top));
  padding:env(safe-area-inset-top) var(--sp-4) 0;display:flex;align-items:center;justify-content:space-between;
  background:var(--surface-glass);-webkit-backdrop-filter:var(--blur-chrome);backdrop-filter:var(--blur-chrome);
  border-bottom:1px solid var(--hairline);box-shadow:var(--inset-top);}
.header__title{font-weight:640;font-size:var(--fs-title);letter-spacing:var(--tracking-tight);}
.header__action{width:36px;height:36px;display:grid;place-items:center;border-radius:var(--r-pill);
  color:var(--text-secondary);background:var(--surface-2);border:1px solid var(--hairline);}
.header__action svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.75;}

main{padding:var(--sp-4) var(--sp-4) calc(150px + env(safe-area-inset-bottom));}
.screen{display:none;animation:fade var(--dur-2) var(--ease-out);}
.screen--active{display:block;}
@keyframes fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.section-label{font-size:var(--fs-caption);font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caption);
  color:var(--text-tertiary);margin:var(--sp-6) var(--sp-1) var(--sp-3);}
.section-label:first-child{margin-top:var(--sp-2);}
.building{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:12px 16px;border-radius:14px;background:linear-gradient(135deg,rgba(52,211,153,0.14),rgba(110,139,255,0.10));border:1px solid rgba(52,211,153,0.30);color:var(--text-primary);font-size:14px;font-weight:600;box-shadow:var(--inset-top);}
.building .pulse{width:10px;height:10px;border-radius:50%;background:var(--status-active);animation:pulse 1.4s ease-out infinite;flex:0 0 auto;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,0.6);}70%{box-shadow:0 0 0 10px rgba(52,211,153,0);}100%{box-shadow:0 0 0 0 rgba(52,211,153,0);}}

/* ring */
.ring-wrap{display:flex;flex-direction:column;align-items:center;padding:var(--sp-4) 0 var(--sp-2);}
.ring-stack{position:relative;width:230px;height:230px;}
.ring{width:230px;height:230px;transform:rotate(-90deg);}
.ring circle{fill:none;}
.ring .track{stroke:var(--surface-3);}
.ring__center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;}
.ring__num{font-size:46px;font-weight:700;letter-spacing:var(--tracking-tight);font-variant-numeric:tabular-nums;}
.ring__lbl{font-size:var(--fs-caption);font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caption);color:var(--text-tertiary);}
.ring-legend{display:flex;gap:var(--sp-4);justify-content:center;margin-top:var(--sp-2);}
.ring-legend span{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-sub);color:var(--text-secondary);}
.ring-legend i{width:8px;height:8px;border-radius:50%;box-shadow:0 0 6px currentColor;}

/* kpi grid */
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);}
.kpi{position:relative;overflow:hidden;padding:var(--sp-4);border-radius:var(--r-lg);background:var(--surface);
  border:1px solid var(--hairline);box-shadow:var(--e-2),var(--inset-top);}
.kpi__label{font-size:var(--fs-caption);font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caption);color:var(--text-tertiary);}
.kpi__value{margin-top:var(--sp-2);font-size:var(--fs-display);line-height:1;font-weight:700;letter-spacing:var(--tracking-tight);font-variant-numeric:tabular-nums;}
.kpi--hero::after{content:"";position:absolute;inset:-40% -40% auto auto;width:70%;height:140%;
  background:var(--accent-gradient-radial);opacity:.18;pointer-events:none;filter:blur(8px);}

/* generic card list */
.row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-4);border-radius:var(--r-md);
  background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--e-1),var(--inset-top);
  transition:transform var(--dur-1) var(--ease-out),border-color var(--dur-1) var(--ease-out);margin-bottom:var(--sp-2);}
.row:active{transform:scale(.985);border-color:var(--hairline-strong);}
.row__avatar{width:40px;height:40px;border-radius:var(--r-sm);display:grid;place-items:center;font-weight:700;
  background:var(--surface-3);border:1px solid var(--hairline);flex:0 0 auto;}
.row__main{flex:1;min-width:0;}
.row__name{font-size:var(--fs-h2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.row__meta{font-size:var(--fs-sub);color:var(--text-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.row__chev{color:var(--text-tertiary);flex:0 0 auto;}
.row__chev svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.75;}
.dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 6px currentColor;}

/* project card */
.proj-card{padding:var(--sp-4);border-radius:var(--r-md);background:var(--surface);border:1px solid var(--hairline);
  box-shadow:var(--e-1),var(--inset-top);display:flex;flex-direction:column;gap:var(--sp-3);margin-bottom:var(--sp-2);
  transition:transform var(--dur-1) var(--ease-out);}
.proj-card:active{transform:scale(.985);}
.proj-card__top{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--sp-2);}
.proj-card__name{font-size:var(--fs-h2);font-weight:600;}
.proj-card__obj{font-size:var(--fs-body);color:var(--text-secondary);}
.proj-card__footer{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sub);color:var(--text-tertiary);}
.tag{padding:2px 8px;border-radius:var(--r-pill);background:var(--surface-2);border:1px solid var(--hairline);font-size:var(--fs-caption);}
.repo-link{display:inline-flex;align-items:center;gap:4px;color:var(--accent);font-family:var(--font-mono);font-size:12px;text-decoration:none;}

/* chips */
.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 9px 3px 8px;border-radius:var(--r-pill);
  font-size:var(--fs-caption);font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caption);}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 6px currentColor;}
.chip--active{color:var(--status-active);background:var(--status-active-soft);}
.chip--planning{color:var(--status-planning);background:var(--status-planning-soft);}
.chip--blocked{color:var(--status-blocked);background:var(--status-blocked-soft);}
.chip--done{color:var(--status-done);background:var(--status-done-soft);}
.chip--paused{color:var(--status-paused);background:var(--status-paused-soft);}

/* segmented */
.segmented{display:flex;gap:2px;padding:3px;border-radius:var(--r-md);background:var(--surface-2);
  border:1px solid var(--hairline);margin-bottom:var(--sp-4);position:sticky;top:calc(52px + env(safe-area-inset-top));z-index:5;}
.segmented button{flex:1;border:none;background:none;color:var(--text-secondary);font:inherit;font-size:var(--fs-sub);
  font-weight:600;padding:7px 4px;border-radius:var(--r-sm);transition:all var(--dur-1) var(--ease-out);display:flex;align-items:center;justify-content:center;gap:5px;}
.segmented button.on{background:var(--surface-3);color:var(--text-primary);box-shadow:var(--e-1);}
.segmented .badge{padding:0 6px;border-radius:var(--r-pill);background:var(--surface);font-size:10px;color:var(--text-tertiary);}

/* task card */
.task-card{position:relative;padding:var(--sp-3) var(--sp-3) var(--sp-3) calc(var(--sp-3) + 4px);border-radius:var(--r-sm);
  background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--e-1);margin-bottom:var(--sp-2);
  transition:transform var(--dur-1) var(--ease-spring);}
.task-card:active{transform:scale(1.015);}
.task-card.new{animation:pop var(--dur-3) var(--ease-spring);}
@keyframes pop{from{opacity:0;transform:scale(.9) translateY(-8px);background:var(--accent-soft);}to{opacity:1;transform:none;}}
.task-card::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:var(--r-pill);background:var(--status-paused);}
.task-card.s-inbox::before{background:var(--status-planning);}
.task-card.s-active::before{background:var(--status-active);}
.task-card.s-blocked::before{background:var(--status-blocked);}
.task-card.s-done::before{background:var(--status-done);}
.task-card__title{font-size:var(--fs-body);font-weight:500;}
.task-card__meta{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-caption);color:var(--text-tertiary);margin-top:6px;font-family:var(--font-mono);}

/* builds feed */
.build-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);
  background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--e-1);margin-bottom:var(--sp-2);text-decoration:none;color:inherit;}
.build-row.fresh{animation:glowin 1.6s var(--ease-out);}
@keyframes glowin{from{box-shadow:0 0 0 1px var(--accent),0 0 28px var(--accent-glow);}to{box-shadow:var(--e-1);}}
.build-row__icon{width:34px;height:34px;border-radius:var(--r-sm);display:grid;place-items:center;color:var(--accent);
  background:var(--accent-soft);flex:0 0 auto;}
.build-row__icon svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.75;}
.build-row__t{flex:1;min-width:0;}
.build-row__title{font-size:var(--fs-body);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.build-row__time{font-size:var(--fs-caption);color:var(--text-tertiary);}

/* command pill */
.command-pill{position:fixed;left:var(--sp-4);right:var(--sp-4);bottom:calc(64px + env(safe-area-inset-bottom) + 10px);
  z-index:70;height:50px;border:none;border-radius:var(--r-pill);display:flex;align-items:center;gap:var(--sp-3);padding:0 var(--sp-3) 0 var(--sp-2);
  background:var(--surface-glass);-webkit-backdrop-filter:var(--blur-chrome);backdrop-filter:var(--blur-chrome);
  border:1px solid var(--hairline-strong);box-shadow:var(--e-3);color:var(--text-secondary);font:inherit;font-size:var(--fs-body);
  transition:transform var(--dur-1) var(--ease-spring);}
.command-pill:active{transform:scale(.98);}
.command-pill .orb{width:38px;height:38px;border-radius:var(--r-pill);display:grid;place-items:center;color:#fff;
  background:var(--accent-gradient);box-shadow:var(--glow-accent);flex:0 0 auto;}
.command-pill .orb svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.75;}

/* tab bar */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:80;display:flex;padding:8px var(--sp-2) calc(8px + env(safe-area-inset-bottom));
  background:var(--surface-glass);-webkit-backdrop-filter:var(--blur-chrome);backdrop-filter:var(--blur-chrome);
  border-top:1px solid var(--hairline);box-shadow:var(--inset-top);}
.tab{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;color:var(--text-tertiary);
  font-size:10px;font-weight:600;border:none;background:none;transition:color var(--dur-1) var(--ease-out);}
.tab svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.75;}
.tab--active{color:var(--accent);}
.tab--active svg{filter:drop-shadow(0 0 8px var(--accent-glow));}
.tab--active::before{content:"";position:absolute;top:0;width:16px;height:3px;border-radius:var(--r-pill);background:var(--accent);box-shadow:0 0 10px var(--accent-glow);}

/* detail overlay */
.detail{position:fixed;inset:0;z-index:90;background:var(--bg-base);overflow-y:auto;
  transform:translateX(100%);transition:transform var(--dur-3) var(--ease-snappy);
  padding-bottom:calc(80px + env(safe-area-inset-bottom));}
.detail.in{transform:none;}
.detail .dhead{position:sticky;top:0;z-index:5;height:calc(52px + env(safe-area-inset-top));padding:env(safe-area-inset-top) var(--sp-4) 0;
  display:flex;align-items:center;gap:var(--sp-2);background:var(--surface-glass);backdrop-filter:var(--blur-chrome);border-bottom:1px solid var(--hairline);}
.detail .back{display:inline-flex;align-items:center;gap:2px;color:var(--accent);background:none;border:none;font:inherit;font-size:var(--fs-body);}
.detail .back svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;}
.detail .dbody{padding:var(--sp-5) var(--sp-4);}
.detail h1{font-size:28px;font-weight:700;letter-spacing:var(--tracking-tight);margin:0 0 var(--sp-2);}
.detail .obj{font-size:var(--fs-body);color:var(--text-secondary);margin-bottom:var(--sp-4);}
.md h2{font-size:18px;font-weight:640;margin:16px 0 6px;letter-spacing:var(--tracking-tight);}
.md h3{font-size:14px;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:var(--tracking-caption);margin:16px 0 4px;}
.md h4{font-size:13px;font-weight:600;color:var(--text-secondary);margin:10px 0 2px;}
.md p{font-size:14px;color:var(--text-secondary);margin:6px 0;line-height:21px;}
.md ul{margin:6px 0;padding-left:18px;}
.md li{font-size:14px;color:var(--text-secondary);margin:3px 0;line-height:20px;}
.md a{color:var(--accent);word-break:break-all;}
.md b{color:var(--text-primary);}
.md code{font-family:var(--font-mono);font-size:12px;background:var(--surface-2);padding:1px 6px;border-radius:6px;color:var(--text-primary);}

/* command sheet */
.sheet-backdrop{position:fixed;inset:0;z-index:95;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity var(--dur-3) var(--ease-out);}
.sheet-backdrop.in{opacity:1;pointer-events:auto;}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:96;height:88dvh;display:flex;flex-direction:column;
  background:var(--surface);border-radius:var(--r-xl) var(--r-xl) 0 0;border-top:1px solid var(--hairline-strong);
  box-shadow:var(--e-4);transform:translateY(100%);transition:transform var(--dur-3) var(--ease-snappy);overflow:hidden;}
.sheet.in{transform:none;}
.sheet__grab{width:38px;height:5px;border-radius:var(--r-pill);background:var(--surface-3);margin:10px auto 4px;flex:0 0 auto;}
.sheet__head{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-2) var(--sp-4) var(--sp-3);flex:0 0 auto;}
.sheet__head h2{font-size:var(--fs-h2);font-weight:600;margin:0;}
.sheet__close{background:none;border:none;color:var(--text-secondary);font:inherit;font-size:var(--fs-body);}
.chat{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);}
.bubble{max-width:84%;padding:10px 14px;font-size:var(--fs-body);line-height:21px;}
.bubble--assistant{align-self:flex-start;background:var(--surface-2);border:1px solid var(--hairline);
  border-radius:var(--r-lg) var(--r-lg) var(--r-lg) var(--r-xs);box-shadow:var(--e-1);}
.bubble--user{align-self:flex-end;color:#fff;background:var(--accent-gradient);
  border-radius:var(--r-lg) var(--r-lg) var(--r-xs) var(--r-lg);box-shadow:0 6px 18px var(--accent-glow);}
.bubble--sys{align-self:center;background:var(--surface-3);color:var(--text-secondary);font-size:var(--fs-sub);border-radius:var(--r-pill);padding:4px 12px;}
.sheet__controls{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);flex:0 0 auto;}
.composer{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4) calc(var(--sp-3) + env(safe-area-inset-bottom));
  background:var(--surface);border-top:1px solid var(--hairline);flex:0 0 auto;}
.input{flex:1;height:44px;padding:0 var(--sp-4);border-radius:var(--r-pill);background:var(--surface-2);border:1px solid var(--hairline);
  color:var(--text-primary);font-size:var(--fs-body);}
.input::placeholder{color:var(--text-tertiary);}
.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.mic{position:relative;flex:0 0 auto;width:52px;height:52px;border-radius:var(--r-pill);border:none;display:grid;place-items:center;
  color:#fff;background:var(--accent-gradient);box-shadow:var(--glow-accent);transition:transform var(--dur-1) var(--ease-spring);}
.mic:active{transform:scale(.92);}
.mic svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.75;}
.mic.listening{animation:breathe 1.6s var(--ease-out) infinite;}
.mic.listening::after{content:"";position:absolute;inset:-6px;border-radius:var(--r-pill);border:2px solid var(--accent);animation:ring 1.6s var(--ease-out) infinite;}
@keyframes breathe{0%,100%{box-shadow:var(--glow-accent);}50%{box-shadow:0 0 0 1px var(--accent),0 0 36px var(--accent-glow);}}
@keyframes ring{0%{transform:scale(.9);opacity:.7;}100%{transform:scale(1.6);opacity:0;}}
.btn{height:40px;padding:0 var(--sp-4);border-radius:var(--r-md);font:inherit;font-size:var(--fs-sub);font-weight:600;
  border:1px solid var(--hairline);background:var(--surface-2);color:var(--text-primary);display:inline-flex;align-items:center;gap:6px;}
.btn--on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);}

/* empty + skeleton */
.empty{display:flex;flex-direction:column;align-items:center;gap:var(--sp-3);padding:var(--sp-12) var(--sp-6);text-align:center;}
.empty__icon{width:56px;height:56px;border-radius:var(--r-lg);display:grid;place-items:center;color:var(--text-tertiary);
  background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--inset-top);}
.empty__icon svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.75;}
.empty__title{font-size:var(--fs-h2);font-weight:600;}
.empty__sub{font-size:var(--fs-body);color:var(--text-tertiary);max-width:28ch;}
.skeleton{border-radius:var(--r-sm);background:linear-gradient(100deg,var(--surface) 30%,var(--surface-2) 50%,var(--surface) 70%);
  background-size:200% 100%;animation:shimmer 1.4s ease-in-out infinite;height:64px;margin-bottom:var(--sp-2);}
@keyframes shimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}

/* gate */
#gate{position:fixed;inset:0;z-index:200;background:var(--bg-base);display:none;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-4);padding:var(--sp-6);}
#gate.show{display:flex;}
#gate h1{font-size:24px;font-weight:700;}
#gate p{color:var(--text-tertiary);text-align:center;margin:0;}
#gate form{display:flex;gap:var(--sp-2);width:100%;max-width:360px;}