/* ═══════════════════════════════════════════════════════════════════════
   Warp Hub — looks and layouts
   GENERATED from the catalogue. Do not hand-edit: change themes.py and
   re-run emit.py, or the next regeneration silently drops your edit.

   A look is 13 colours, a 7-step radius scale, a root font-size and two
   fonts. A layout is which home screen you get. They are independent, so
   N looks x M layouts costs N + M.

   Green and red are absent on purpose. Green means "the one action" and
   red means "the line between now and context"; a look that moved them
   would move their meaning.
   ═══════════════════════════════════════════════════════════════════════ */

:root,
html[data-look="midnight"] {
  --c-primary: 201 168 76;
  --c-on-primary: 26 35 50;
  --c-background: 26 35 50;
  --c-on-background: 229 226 225;
  --c-surface: 26 35 50;
  --c-on-surface: 229 226 225;
  --c-on-surface-variant: 196 199 199;
  --c-outline-variant: 68 71 71;
  --c-surface-container-lowest: 20 28 41;
  --c-surface-container-low: 29 39 55;
  --c-surface-container: 30 40 56;
  --c-surface-container-high: 42 53 71;
  --c-surface-container-highest: 53 65 85;
  --r-default: 8px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 12px;
  --r-xl: 14px;
  --r-2xl: 16px;
  --r-3xl: 20px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #1a2332;
  --ink: #e5e2e1;
  --dim: #c4c7c7;
  --lit: #c9a84c;
  --on-lit: #1a2332;
  --on-go: #04140c;
}

html[data-look="signal"] {
  --c-primary: 243 179 8;
  --c-on-primary: 0 0 0;
  --c-background: 0 0 0;
  --c-on-background: 247 247 247;
  --c-surface: 0 0 0;
  --c-on-surface: 247 247 247;
  --c-on-surface-variant: 144 144 144;
  --c-outline-variant: 58 58 58;
  --c-surface-container-lowest: 0 0 0;
  --c-surface-container-low: 10 10 10;
  --c-surface-container: 13 13 13;
  --c-surface-container-high: 22 22 22;
  --c-surface-container-highest: 30 30 30;
  --r-default: 0px;
  --r-sm: 0px;
  --r-md: 0px;
  --r-lg: 0px;
  --r-xl: 0px;
  --r-2xl: 0px;
  --r-3xl: 0px;
  --f-sans: Mina;
  --f-display: Mina;
  --root: 15px;
  --ground: #000000;
  --ink: #f7f7f7;
  --dim: #909090;
  --lit: #f3b308;
  --on-lit: #000000;
  --on-go: #04140c;
}

html[data-look="paper"] {
  --c-primary: 21 72 122;
  --c-on-primary: 255 255 255;
  --c-background: 246 244 239;
  --c-on-background: 22 24 29;
  --c-surface: 255 255 255;
  --c-on-surface: 22 24 29;
  --c-on-surface-variant: 92 96 104;
  --c-outline-variant: 214 210 200;
  --c-surface-container-lowest: 255 255 255;
  --c-surface-container-low: 250 248 244;
  --c-surface-container: 242 239 232;
  --c-surface-container-high: 234 230 221;
  --c-surface-container-highest: 224 219 208;
  --r-default: 4px;
  --r-sm: 3px;
  --r-md: 5px;
  --r-lg: 6px;
  --r-xl: 8px;
  --r-2xl: 10px;
  --r-3xl: 12px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #f6f4ef;
  --ink: #16181d;
  --dim: #5c6068;
  --lit: #15487a;
  --on-lit: #ffffff;
  --on-go: #04140c;
}

html[data-look="daylight"] {
  --c-primary: 11 87 208;
  --c-on-primary: 255 255 255;
  --c-background: 255 255 255;
  --c-on-background: 16 20 24;
  --c-surface: 255 255 255;
  --c-on-surface: 16 20 24;
  --c-on-surface-variant: 74 81 89;
  --c-outline-variant: 223 227 232;
  --c-surface-container-lowest: 255 255 255;
  --c-surface-container-low: 247 249 251;
  --c-surface-container: 241 244 247;
  --c-surface-container-high: 231 236 241;
  --c-surface-container-highest: 220 227 234;
  --r-default: 10px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 14px;
  --r-xl: 18px;
  --r-2xl: 22px;
  --r-3xl: 26px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 17px;
  --ground: #ffffff;
  --ink: #101418;
  --dim: #4a5159;
  --lit: #0b57d0;
  --on-lit: #ffffff;
  --on-go: #04140c;
}

html[data-look="slate"] {
  --c-primary: 56 189 248;
  --c-on-primary: 6 19 28;
  --c-background: 15 20 25;
  --c-on-background: 232 238 244;
  --c-surface: 15 20 25;
  --c-on-surface: 232 238 244;
  --c-on-surface-variant: 148 163 176;
  --c-outline-variant: 51 65 77;
  --c-surface-container-lowest: 10 14 18;
  --c-surface-container-low: 20 27 33;
  --c-surface-container: 25 33 42;
  --c-surface-container-high: 34 44 54;
  --c-surface-container-highest: 44 57 69;
  --r-default: 6px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 12px;
  --r-2xl: 14px;
  --r-3xl: 18px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #0f1419;
  --ink: #e8eef4;
  --dim: #94a3b0;
  --lit: #38bdf8;
  --on-lit: #06131c;
  --on-go: #04140c;
}

html[data-look="moss"] {
  --c-primary: 216 184 106;
  --c-on-primary: 14 26 18;
  --c-background: 14 26 18;
  --c-on-background: 232 239 230;
  --c-surface: 14 26 18;
  --c-on-surface: 232 239 230;
  --c-on-surface-variant: 154 171 157;
  --c-outline-variant: 43 61 49;
  --c-surface-container-lowest: 10 20 14;
  --c-surface-container-low: 19 32 25;
  --c-surface-container: 23 39 30;
  --c-surface-container-high: 32 51 40;
  --c-surface-container-highest: 42 65 52;
  --r-default: 6px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 12px;
  --r-2xl: 14px;
  --r-3xl: 18px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #0e1a12;
  --ink: #e8efe6;
  --dim: #9aab9d;
  --lit: #d8b86a;
  --on-lit: #0e1a12;
  --on-go: #04140c;
}

html[data-look="nitro"] {
  --c-primary: 122 77 240;
  --c-on-primary: 255 255 255;
  --c-background: 10 7 20;
  --c-on-background: 241 236 255;
  --c-surface: 18 12 34;
  --c-on-surface: 241 236 255;
  --c-on-surface-variant: 167 157 201;
  --c-outline-variant: 51 37 92;
  --c-surface-container-lowest: 12 8 24;
  --c-surface-container-low: 21 14 40;
  --c-surface-container: 26 17 48;
  --c-surface-container-high: 36 22 64;
  --c-surface-container-highest: 46 29 82;
  --r-default: 12px;
  --r-sm: 9px;
  --r-md: 14px;
  --r-lg: 18px;
  --r-xl: 24px;
  --r-2xl: 30px;
  --r-3xl: 36px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #0a0714;
  --ink: #f1ecff;
  --dim: #a79dc9;
  --lit: #7a4df0;
  --on-lit: #ffffff;
  --on-go: #04140c;
}

html[data-look="blueprint"] {
  --c-primary: 56 224 255;
  --c-on-primary: 4 18 26;
  --c-background: 6 16 24;
  --c-on-background: 220 239 251;
  --c-surface: 8 22 31;
  --c-on-surface: 220 239 251;
  --c-on-surface-variant: 127 160 184;
  --c-outline-variant: 18 53 73;
  --c-surface-container-lowest: 5 13 20;
  --c-surface-container-low: 8 21 29;
  --c-surface-container: 10 26 36;
  --c-surface-container-high: 14 36 49;
  --c-surface-container-highest: 18 48 64;
  --r-default: 0px;
  --r-sm: 0px;
  --r-md: 0px;
  --r-lg: 2px;
  --r-xl: 2px;
  --r-2xl: 3px;
  --r-3xl: 3px;
  --f-sans: Mina;
  --f-display: Mina;
  --root: 15px;
  --ground: #061018;
  --ink: #dceffb;
  --dim: #7fa0b8;
  --lit: #38e0ff;
  --on-lit: #04121a;
  --on-go: #04140c;
}

html[data-look="rose"] {
  --c-primary: 232 160 168;
  --c-on-primary: 36 16 26;
  --c-background: 26 13 20;
  --c-on-background: 246 233 236;
  --c-surface: 26 13 20;
  --c-on-surface: 246 233 236;
  --c-on-surface-variant: 181 150 160;
  --c-outline-variant: 69 41 54;
  --c-surface-container-lowest: 21 10 16;
  --c-surface-container-low: 33 16 25;
  --c-surface-container: 40 20 30;
  --c-surface-container-high: 51 26 39;
  --c-surface-container-highest: 64 34 50;
  --r-default: 10px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-2xl: 26px;
  --r-3xl: 32px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #1a0d14;
  --ink: #f6e9ec;
  --dim: #b596a0;
  --lit: #e8a0a8;
  --on-lit: #24101a;
  --on-go: #04140c;
}

html[data-look="copper"] {
  --c-primary: 224 122 63;
  --c-on-primary: 22 13 7;
  --c-background: 13 9 6;
  --c-on-background: 243 233 225;
  --c-surface: 18 13 9;
  --c-on-surface: 243 233 225;
  --c-on-surface-variant: 163 144 127;
  --c-outline-variant: 58 42 30;
  --c-surface-container-lowest: 10 7 5;
  --c-surface-container-low: 20 14 9;
  --c-surface-container: 25 17 11;
  --c-surface-container-high: 35 24 16;
  --c-surface-container-highest: 46 32 21;
  --r-default: 10px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-2xl: 24px;
  --r-3xl: 30px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #0d0906;
  --ink: #f3e9e1;
  --dim: #a3907f;
  --lit: #e07a3f;
  --on-lit: #160d07;
  --on-go: #04140c;
}

html[data-look="arctic"] {
  --c-primary: 27 79 138;
  --c-on-primary: 255 255 255;
  --c-background: 242 246 250;
  --c-on-background: 13 22 35;
  --c-surface: 255 255 255;
  --c-on-surface: 13 22 35;
  --c-on-surface-variant: 84 98 122;
  --c-outline-variant: 207 217 230;
  --c-surface-container-lowest: 255 255 255;
  --c-surface-container-low: 247 250 253;
  --c-surface-container: 238 243 249;
  --c-surface-container-high: 227 235 244;
  --c-surface-container-highest: 214 225 238;
  --r-default: 8px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-2xl: 20px;
  --r-3xl: 24px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #f2f6fa;
  --ink: #0d1623;
  --dim: #54627a;
  --lit: #1b4f8a;
  --on-lit: #ffffff;
  --on-go: #04140c;
}

html[data-look="sand"] {
  --c-primary: 168 82 50;
  --c-on-primary: 255 250 244;
  --c-background: 245 238 226;
  --c-on-background: 36 27 19;
  --c-surface: 255 250 244;
  --c-on-surface: 36 27 19;
  --c-on-surface-variant: 107 92 76;
  --c-outline-variant: 221 208 189;
  --c-surface-container-lowest: 255 253 249;
  --c-surface-container-low: 250 244 234;
  --c-surface-container: 242 233 219;
  --c-surface-container-high: 234 223 204;
  --c-surface-container-highest: 224 210 187;
  --r-default: 6px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 14px;
  --r-2xl: 18px;
  --r-3xl: 22px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #f5eee2;
  --ink: #241b13;
  --dim: #6b5c4c;
  --lit: #a85232;
  --on-lit: #fffaf4;
  --on-go: #04140c;
}

html[data-look="meadow"] {
  --c-primary: 29 107 74;
  --c-on-primary: 255 255 255;
  --c-background: 244 248 244;
  --c-on-background: 17 26 21;
  --c-surface: 255 255 255;
  --c-on-surface: 17 26 21;
  --c-on-surface-variant: 85 100 91;
  --c-outline-variant: 207 220 211;
  --c-surface-container-lowest: 255 255 255;
  --c-surface-container-low: 248 251 248;
  --c-surface-container: 238 244 239;
  --c-surface-container-high: 228 236 230;
  --c-surface-container-highest: 216 227 219;
  --r-default: 8px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 18px;
  --r-2xl: 22px;
  --r-3xl: 28px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #f4f8f4;
  --ink: #111a15;
  --dim: #55645b;
  --lit: #1d6b4a;
  --on-lit: #ffffff;
  --on-go: #04140c;
}

html[data-look="highvis"] {
  --c-primary: 138 90 0;
  --c-on-primary: 255 255 255;
  --c-background: 255 255 255;
  --c-on-background: 0 0 0;
  --c-surface: 255 255 255;
  --c-on-surface: 0 0 0;
  --c-on-surface-variant: 61 61 61;
  --c-outline-variant: 0 0 0;
  --c-surface-container-lowest: 255 255 255;
  --c-surface-container-low: 250 250 250;
  --c-surface-container: 242 242 242;
  --c-surface-container-high: 230 230 230;
  --c-surface-container-highest: 217 217 217;
  --r-default: 4px;
  --r-sm: 3px;
  --r-md: 5px;
  --r-lg: 6px;
  --r-xl: 8px;
  --r-2xl: 10px;
  --r-3xl: 12px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 18px;
  --ground: #ffffff;
  --ink: #000000;
  --dim: #3d3d3d;
  --lit: #8a5a00;
  --on-lit: #ffffff;
  --on-go: #04140c;
}

html[data-look="ink"] {
  --c-primary: 255 255 255;
  --c-on-primary: 0 0 0;
  --c-background: 0 0 0;
  --c-on-background: 255 255 255;
  --c-surface: 0 0 0;
  --c-on-surface: 255 255 255;
  --c-on-surface-variant: 200 200 200;
  --c-outline-variant: 255 255 255;
  --c-surface-container-lowest: 0 0 0;
  --c-surface-container-low: 10 10 10;
  --c-surface-container: 16 16 16;
  --c-surface-container-high: 24 24 24;
  --c-surface-container-highest: 34 34 34;
  --r-default: 0px;
  --r-sm: 0px;
  --r-md: 0px;
  --r-lg: 2px;
  --r-xl: 2px;
  --r-2xl: 3px;
  --r-3xl: 4px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 18px;
  --ground: #000000;
  --ink: #ffffff;
  --dim: #c8c8c8;
  --lit: #ffffff;
  --on-lit: #000000;
  --on-go: #04140c;
}

html[data-look="ocean"] {
  --c-primary: 42 213 196;
  --c-on-primary: 2 43 42;
  --c-background: 5 32 31;
  --c-on-background: 218 244 241;
  --c-surface: 5 32 31;
  --c-on-surface: 218 244 241;
  --c-on-surface-variant: 126 169 165;
  --c-outline-variant: 21 67 64;
  --c-surface-container-lowest: 3 25 24;
  --c-surface-container-low: 7 38 36;
  --c-surface-container: 10 46 44;
  --c-surface-container-high: 14 59 56;
  --c-surface-container-highest: 19 74 70;
  --r-default: 8px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 18px;
  --r-2xl: 22px;
  --r-3xl: 26px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #05201f;
  --ink: #daf4f1;
  --dim: #7ea9a5;
  --lit: #2ad5c4;
  --on-lit: #022b2a;
  --on-go: #04140c;
}

html[data-look="wine"] {
  --c-primary: 217 164 65;
  --c-on-primary: 30 12 17;
  --c-background: 24 10 14;
  --c-on-background: 243 231 227;
  --c-surface: 24 10 14;
  --c-on-surface: 243 231 227;
  --c-on-surface-variant: 168 143 139;
  --c-outline-variant: 61 32 40;
  --c-surface-container-lowest: 18 7 9;
  --c-surface-container-low: 31 13 18;
  --c-surface-container: 38 15 22;
  --c-surface-container-high: 51 21 29;
  --c-surface-container-highest: 66 28 38;
  --r-default: 6px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 14px;
  --r-2xl: 18px;
  --r-3xl: 22px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #180a0e;
  --ink: #f3e7e3;
  --dim: #a88f8b;
  --lit: #d9a441;
  --on-lit: #1e0c11;
  --on-go: #04140c;
}

html[data-look="miami"] {
  --c-primary: 255 77 157;
  --c-on-primary: 22 3 43;
  --c-background: 18 4 37;
  --c-on-background: 251 233 244;
  --c-surface: 26 7 51;
  --c-on-surface: 251 233 244;
  --c-on-surface-variant: 176 150 196;
  --c-outline-variant: 61 26 99;
  --c-surface-container-lowest: 13 3 32;
  --c-surface-container-low: 23 6 46;
  --c-surface-container: 29 9 56;
  --c-surface-container-high: 39 14 73;
  --c-surface-container-highest: 51 19 92;
  --r-default: 14px;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
  --r-2xl: 34px;
  --r-3xl: 42px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #120425;
  --ink: #fbe9f4;
  --dim: #b096c4;
  --lit: #ff4d9d;
  --on-lit: #16032b;
  --on-go: #04140c;
}

html[data-look="steel"] {
  --c-primary: 255 212 0;
  --c-on-primary: 26 26 23;
  --c-background: 22 23 25;
  --c-on-background: 233 235 236;
  --c-surface: 22 23 25;
  --c-on-surface: 233 235 236;
  --c-on-surface-variant: 154 160 164;
  --c-outline-variant: 58 63 68;
  --c-surface-container-lowest: 16 17 18;
  --c-surface-container-low: 28 30 32;
  --c-surface-container: 34 37 40;
  --c-surface-container-high: 43 47 51;
  --c-surface-container-highest: 54 59 64;
  --r-default: 0px;
  --r-sm: 0px;
  --r-md: 2px;
  --r-lg: 2px;
  --r-xl: 3px;
  --r-2xl: 4px;
  --r-3xl: 4px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 15px;
  --ground: #161719;
  --ink: #e9ebec;
  --dim: #9aa0a4;
  --lit: #ffd400;
  --on-lit: #1a1a17;
  --on-go: #04140c;
}

html[data-look="sunrise"] {
  --c-primary: 194 65 12;
  --c-on-primary: 255 253 251;
  --c-background: 255 247 241;
  --c-on-background: 34 21 14;
  --c-surface: 255 255 255;
  --c-on-surface: 34 21 14;
  --c-on-surface-variant: 109 90 78;
  --c-outline-variant: 240 221 205;
  --c-surface-container-lowest: 255 253 251;
  --c-surface-container-low: 255 249 244;
  --c-surface-container: 255 241 230;
  --c-surface-container-high: 255 232 216;
  --c-surface-container-highest: 255 220 198;
  --r-default: 10px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-2xl: 26px;
  --r-3xl: 32px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #fff7f1;
  --ink: #22150e;
  --dim: #6d5a4e;
  --lit: #c2410c;
  --on-lit: #fffdfb;
  --on-go: #04140c;
}

html[data-look="nightdrive"] {
  --c-primary: 34 211 238;
  --c-on-primary: 4 18 26;
  --c-background: 6 11 36;
  --c-on-background: 230 243 255;
  --c-surface: 10 17 48;
  --c-on-surface: 230 243 255;
  --c-on-surface-variant: 143 163 200;
  --c-outline-variant: 31 47 102;
  --c-surface-container-lowest: 4 8 32;
  --c-surface-container-low: 10 17 48;
  --c-surface-container: 14 22 56;
  --c-surface-container-high: 21 32 73;
  --c-surface-container-highest: 28 42 92;
  --r-default: 14px;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
  --r-2xl: 34px;
  --r-3xl: 42px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #060b24;
  --ink: #e6f3ff;
  --dim: #8fa3c8;
  --lit: #22d3ee;
  --on-lit: #04121a;
  --on-go: #04140c;
}

html[data-look="vegas"] {
  --c-primary: 245 184 46;
  --c-on-primary: 26 16 3;
  --c-background: 13 8 18;
  --c-on-background: 247 239 226;
  --c-surface: 20 12 26;
  --c-on-surface: 247 239 226;
  --c-on-surface-variant: 173 159 179;
  --c-outline-variant: 58 39 66;
  --c-surface-container-lowest: 8 5 12;
  --c-surface-container-low: 20 12 26;
  --c-surface-container: 26 16 34;
  --c-surface-container-high: 36 22 46;
  --c-surface-container-highest: 47 29 60;
  --r-default: 14px;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
  --r-2xl: 34px;
  --r-3xl: 42px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #0d0812;
  --ink: #f7efe2;
  --dim: #ad9fb3;
  --lit: #f5b82e;
  --on-lit: #1a1003;
  --on-go: #04140c;
}

html[data-look="sunset"] {
  --c-primary: 255 138 76;
  --c-on-primary: 31 10 2;
  --c-background: 26 6 25;
  --c-on-background: 253 238 230;
  --c-surface: 34 10 32;
  --c-on-surface: 253 238 230;
  --c-on-surface-variant: 193 154 180;
  --c-outline-variant: 74 26 68;
  --c-surface-container-lowest: 18 4 15;
  --c-surface-container-low: 32 10 30;
  --c-surface-container: 40 13 38;
  --c-surface-container-high: 52 18 50;
  --c-surface-container-highest: 66 24 63;
  --r-default: 14px;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
  --r-2xl: 34px;
  --r-3xl: 42px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #1a0619;
  --ink: #fdeee6;
  --dim: #c19ab4;
  --lit: #ff8a4c;
  --on-lit: #1f0a02;
  --on-go: #04140c;
}

html[data-look="riviera"] {
  --c-primary: 255 160 122;
  --c-on-primary: 42 14 2;
  --c-background: 3 32 42;
  --c-on-background: 227 246 248;
  --c-surface: 6 42 54;
  --c-on-surface: 227 246 248;
  --c-on-surface-variant: 143 181 189;
  --c-outline-variant: 19 70 83;
  --c-surface-container-lowest: 2 26 34;
  --c-surface-container-low: 6 42 54;
  --c-surface-container: 8 49 63;
  --c-surface-container-high: 13 62 78;
  --c-surface-container-highest: 18 76 94;
  --r-default: 14px;
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
  --r-2xl: 34px;
  --r-3xl: 42px;
  --f-sans: Geist;
  --f-display: Sora;
  --root: 16px;
  --ground: #03202a;
  --ink: #e3f6f8;
  --dim: #8fb5bd;
  --lit: #ffa07a;
  --on-lit: #2a0e02;
  --on-go: #04140c;
}


html { font-size: var(--root, 16px); }
body { background: rgb(var(--c-background)); color: rgb(var(--c-on-background)); background-attachment: fixed; }
/* signal-grid.css paints the top strip and the bottom nav off its own token
   set; both now read the same variables, so there is one system again. */
.sg-top, .sg-nav, .topbar, .bottomnav { background: rgb(var(--c-background)); color: rgb(var(--c-on-background)); }

html[data-look="midnight"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #24344d 0%, transparent 70%);}
html[data-look="midnight"] .card{box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 28px -14px rgba(0,0,0,.7);}

html[data-look="paper"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #ffffff 0%, transparent 70%);}
html[data-look="paper"] .card{box-shadow:0 1px 2px rgba(16,24,40,.06),0 6px 18px -8px rgba(16,24,40,.12);}

html[data-look="daylight"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #eef4fb 0%, transparent 70%);}
html[data-look="daylight"] .card{box-shadow:0 1px 2px rgba(16,24,40,.06),0 6px 18px -8px rgba(16,24,40,.12);}

html[data-look="slate"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #1a2a38 0%, transparent 70%);}
html[data-look="slate"] .card{box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 28px -14px rgba(0,0,0,.7);}

html[data-look="moss"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #1c3325 0%, transparent 70%);}
html[data-look="moss"] .card{box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 28px -14px rgba(0,0,0,.7);}

html[data-look="nitro"] body{background-image:
  radial-gradient(1100px 620px at 50% -12%, #2a1358 0%, rgba(42,19,88,0) 68%),
  radial-gradient(760px 520px at 108% 8%, #17143f 0%, rgba(23,20,63,0) 62%);}
html[data-look="nitro"] .bg-primary{box-shadow:0 0 0 1px rgba(122,77,240,.45),0 10px 34px -8px rgba(122,77,240,.75);}
html[data-look="nitro"] .card{backdrop-filter:blur(9px);}

html[data-look="blueprint"] body{background-image:
  repeating-linear-gradient(0deg, rgba(56,224,255,.055) 0 1px, transparent 1px 24px),
  repeating-linear-gradient(90deg, rgba(56,224,255,.055) 0 1px, transparent 1px 24px);}
html[data-look="blueprint"] .card{background-color:rgba(10,26,36,.66)!important;border:1px solid rgba(56,224,255,.26)!important;}

html[data-look="arctic"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #ffffff 0%, transparent 70%);}
html[data-look="arctic"] .card{box-shadow:0 1px 2px rgba(16,24,40,.06),0 6px 18px -8px rgba(16,24,40,.12);}

html[data-look="sand"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #fffaf2 0%, transparent 70%);}
html[data-look="sand"] .card{box-shadow:0 1px 2px rgba(16,24,40,.06),0 6px 18px -8px rgba(16,24,40,.12);}

html[data-look="meadow"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #ffffff 0%, transparent 70%);}
html[data-look="meadow"] .card{box-shadow:0 1px 2px rgba(16,24,40,.06),0 6px 18px -8px rgba(16,24,40,.12);}

html[data-look="wine"] body{background-image:radial-gradient(1100px 600px at 50% -18%, #36121d 0%, transparent 70%);}
html[data-look="wine"] .card{box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 28px -14px rgba(0,0,0,.7);}

html[data-look="miami"] body{background-image:
  radial-gradient(900px 560px at 12% -8%, #3a0a5e 0%, rgba(58,10,94,0) 66%),
  radial-gradient(760px 500px at 104% 12%, #5c0a3a 0%, rgba(92,10,58,0) 62%);}
html[data-look="miami"] .bg-primary{box-shadow:0 8px 30px -8px rgba(255,77,157,.8);}

html[data-look="sunrise"] body{background-image:
  radial-gradient(1000px 520px at 50% -14%, #ffe3cd 0%, rgba(255,227,205,0) 70%);}

html[data-look="nightdrive"] body{background-image:
  radial-gradient(900px 560px at 12% -8%, #0f2a6b 0%, transparent 66%),
  radial-gradient(760px 500px at 104% 12%, #053a4a 0%, transparent 62%);}
html[data-look="nightdrive"] .bg-primary{box-shadow:0 8px 30px -8px rgba(34,211,238,.8);}

html[data-look="vegas"] body{background-image:
  radial-gradient(900px 560px at 12% -8%, #3b1a4f 0%, transparent 66%),
  radial-gradient(760px 500px at 104% 12%, #4a2a06 0%, transparent 62%);}
html[data-look="vegas"] .bg-primary{box-shadow:0 8px 30px -8px rgba(245,184,46,.8);}

html[data-look="sunset"] body{background-image:
  radial-gradient(900px 560px at 12% -8%, #5a0f3c 0%, transparent 66%),
  radial-gradient(760px 500px at 104% 12%, #6b2a0a 0%, transparent 62%);}
html[data-look="sunset"] .bg-primary{box-shadow:0 8px 30px -8px rgba(255,138,76,.8);}

html[data-look="riviera"] body{background-image:
  radial-gradient(900px 560px at 12% -8%, #075063 0%, transparent 66%),
  radial-gradient(760px 500px at 104% 12%, #5a2a1e 0%, transparent 62%);}
html[data-look="riviera"] .bg-primary{box-shadow:0 8px 30px -8px rgba(255,160,122,.8);}


/* Accent hues restepped for light looks (see emit.py). */
html[data-look="paper"] .text-red-400,
html[data-look="paper"] .text-red-300 { color: #b91c1c; }
html[data-look="paper"] .text-green-400,
html[data-look="paper"] .text-green-300 { color: #15803d; }
html[data-look="paper"] .text-orange-400,
html[data-look="paper"] .text-orange-300 { color: #c2410c; }
html[data-look="paper"] .text-amber-400,
html[data-look="paper"] .text-amber-300 { color: #b45309; }
html[data-look="daylight"] .text-red-400,
html[data-look="daylight"] .text-red-300 { color: #b91c1c; }
html[data-look="daylight"] .text-green-400,
html[data-look="daylight"] .text-green-300 { color: #15803d; }
html[data-look="daylight"] .text-orange-400,
html[data-look="daylight"] .text-orange-300 { color: #c2410c; }
html[data-look="daylight"] .text-amber-400,
html[data-look="daylight"] .text-amber-300 { color: #b45309; }
html[data-look="arctic"] .text-red-400,
html[data-look="arctic"] .text-red-300 { color: #b91c1c; }
html[data-look="arctic"] .text-green-400,
html[data-look="arctic"] .text-green-300 { color: #15803d; }
html[data-look="arctic"] .text-orange-400,
html[data-look="arctic"] .text-orange-300 { color: #c2410c; }
html[data-look="arctic"] .text-amber-400,
html[data-look="arctic"] .text-amber-300 { color: #b45309; }
html[data-look="sand"] .text-red-400,
html[data-look="sand"] .text-red-300 { color: #b91c1c; }
html[data-look="sand"] .text-green-400,
html[data-look="sand"] .text-green-300 { color: #15803d; }
html[data-look="sand"] .text-orange-400,
html[data-look="sand"] .text-orange-300 { color: #c2410c; }
html[data-look="sand"] .text-amber-400,
html[data-look="sand"] .text-amber-300 { color: #b45309; }
html[data-look="meadow"] .text-red-400,
html[data-look="meadow"] .text-red-300 { color: #b91c1c; }
html[data-look="meadow"] .text-green-400,
html[data-look="meadow"] .text-green-300 { color: #15803d; }
html[data-look="meadow"] .text-orange-400,
html[data-look="meadow"] .text-orange-300 { color: #c2410c; }
html[data-look="meadow"] .text-amber-400,
html[data-look="meadow"] .text-amber-300 { color: #b45309; }
html[data-look="highvis"] .text-red-400,
html[data-look="highvis"] .text-red-300 { color: #b91c1c; }
html[data-look="highvis"] .text-green-400,
html[data-look="highvis"] .text-green-300 { color: #15803d; }
html[data-look="highvis"] .text-orange-400,
html[data-look="highvis"] .text-orange-300 { color: #c2410c; }
html[data-look="highvis"] .text-amber-400,
html[data-look="highvis"] .text-amber-300 { color: #b45309; }
html[data-look="sunrise"] .text-red-400,
html[data-look="sunrise"] .text-red-300 { color: #b91c1c; }
html[data-look="sunrise"] .text-green-400,
html[data-look="sunrise"] .text-green-300 { color: #15803d; }
html[data-look="sunrise"] .text-orange-400,
html[data-look="sunrise"] .text-orange-300 { color: #c2410c; }
html[data-look="sunrise"] .text-amber-400,
html[data-look="sunrise"] .text-amber-300 { color: #b45309; }

/* ── LAYOUTS ─────────────────────────────────────────────────────────────
   The alternate home screens are a RE-PRESENTATION of what the app already
   rendered: hub-looks.js reads #hero-count, #hero-week, #hero-contacts and
   the rest, and paints them in a different shape. There is no second copy
   of the numbers, so a layout can never disagree with the app — and a
   change to how a figure is worked out lands in all three at once. */
#alt-layout { display: none; }
html[data-layout="rings"] #hero-licensed,
html[data-layout="board"] #hero-licensed { display: none !important; }
html[data-layout="rings"] #alt-layout,
html[data-layout="board"] #alt-layout { display: block; }

/* Rings */
.alt-rings { padding-top: .25rem; }
.alt-rings .rings { display: grid; place-items: center; position: relative; }
.alt-rings svg { transform: rotate(-90deg); max-width: 100%; height: auto; }
.alt-rings .mid { position: absolute; text-align: center; }
.alt-rings .mid b { display: block; font: 800 2.5rem/1 var(--f-display), system-ui, sans-serif; letter-spacing: -.02em; }
.alt-rings .mid span { font: 700 .625rem/1 var(--f-sans), system-ui, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: rgb(var(--c-on-surface-variant)); }
.alt-legend { display: flex; justify-content: center; flex-wrap: wrap; gap: .5rem 1rem; margin-top: .7rem; }
.alt-legend span { font: 700 .625rem/1 var(--f-sans), system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: rgb(var(--c-on-surface-variant)); }
.alt-legend i { width: .55rem; height: .55rem; border-radius: 999px; display: inline-block; margin-right: .35rem; vertical-align: middle; }
.alt-strip { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .4rem; margin-top: 1rem; }
.alt-strip div { text-align: center; padding: .65rem .25rem; background: rgb(var(--c-surface-container-high)); border-radius: var(--r-md); }
.alt-strip b { display: block; font: 800 1.2rem/1 var(--f-display), system-ui, sans-serif; margin-top: .3rem; }

/* Board */
.alt-board { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .5rem; }
.alt-tile { background: rgb(var(--c-surface-container-high)); border-radius: var(--r-md); padding: .8rem; min-width: 0; }
.alt-tile.wide { grid-column: 1 / -1; }
.alt-tile.hero { background: rgb(var(--c-primary)); color: rgb(var(--c-on-primary)); }
.alt-tile b { display: block; font: 800 1.85rem/1 var(--f-display), system-ui, sans-serif; margin-top: .45rem; overflow-wrap: anywhere; }
.alt-tile.hero b { font-size: 2.75rem; }
.alt-tile small { font: 700 .8rem/1 var(--f-sans), system-ui, sans-serif; opacity: .7; }
.alt-k { font: 700 .625rem/1.3 var(--f-sans), system-ui, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: rgb(var(--c-on-surface-variant)); }
.alt-tile.hero .alt-k { color: rgb(var(--c-on-primary)); opacity: .8; }
/* No sparkline class here on purpose: the one that existed charted days
   elapsed rather than dials, which looked like data and was not. Board uses
   .alt-bar with the real week figure instead. */
.alt-bar { height: .45rem; border-radius: 999px; background: rgb(var(--c-outline-variant)); margin-top: .55rem; overflow: hidden; }
.alt-bar i { display: block; height: 100%; background: rgb(var(--c-primary)); }

/* ── THE PICKERS (Profile) ───────────────────────────────────────────── */
.pick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.5rem, 1fr)); gap: .5rem; }
.pick { position: relative; border: 2px solid rgb(var(--c-outline-variant)); border-radius: var(--r-md);
  padding: .5rem; cursor: pointer; background: none; text-align: left; min-height: 44px; }
.pick[aria-pressed="true"] { border-color: rgb(var(--c-primary)); }
.pick .sw { display: flex; gap: .2rem; margin-bottom: .4rem; }
.pick .sw i { width: 1rem; height: 1rem; border-radius: 999px; border: 1px solid rgba(128,128,128,.35); }
.pick .nm { display: block; font: 700 .7rem/1.2 var(--f-sans), system-ui, sans-serif; color: rgb(var(--c-on-surface)); }
.pick .tg { display: block; font: 400 .625rem/1.3 var(--f-sans), system-ui, sans-serif; color: rgb(var(--c-on-surface-variant)); margin-top: .15rem; }
.look-fold > summary { display: flex; align-items: center; gap: .6rem; cursor: pointer; list-style: none;
  border: 2px solid rgb(var(--c-outline-variant)); border-radius: var(--r-md); padding: .55rem .7rem; min-height: 44px; }
.look-fold > summary::-webkit-details-marker { display: none; }
.look-fold[open] > summary { border-color: rgb(var(--c-primary)); }
.look-cur { display: flex; align-items: center; gap: .5rem; flex: 1; min-width: 0; }
.look-cur .sw { display: flex; gap: .2rem; }
.look-cur .sw i { width: 1rem; height: 1rem; border-radius: 999px; border: 1px solid rgba(128,128,128,.35); }
.look-cur .nm { font: 700 .8rem/1.2 var(--f-sans), system-ui, sans-serif; color: rgb(var(--c-on-surface)); }
.look-chg { font: 700 .7rem/1 var(--f-sans), system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: rgb(var(--c-primary)); }
.look-fold[open] .look-chg { font-size: 0; }
.look-fold[open] .look-chg::after { content: "Done"; font-size: .7rem; }
.pick-row { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .5rem; }
.pick-lay { border: 2px solid rgb(var(--c-outline-variant)); border-radius: var(--r-md); padding: .6rem .5rem;
  cursor: pointer; background: none; min-height: 44px; }
.pick-lay[aria-pressed="true"] { border-color: rgb(var(--c-primary)); }
.pick-lay svg { width: 100%; height: auto; display: block; margin-bottom: .4rem; }
.pick-lay .nm { font: 700 .7rem/1.2 var(--f-sans), system-ui, sans-serif; color: rgb(var(--c-on-surface)); }
@media (prefers-reduced-motion: no-preference) {
  .pick, .pick-lay { transition: border-color .15s ease; }
}