/* =================================================================== WholeTech Skins — shared design-kit system for the network template. One file, linked by every included site. The element carries two classes set by the rollout: wtk- + wtt- (theme 1-5). The picker swaps wtt-1..5 within the site's fixed kit. Works because every generic site consumes the same template vars (--h/--b/--r + colors) and classes (.nav .hero .grid .card .section). Each theme sets BOTH naming conventions (short --sf/--bd/--tx/--ac AND long --surface/--border/--text/--accent + named accents) so it applies on every template variant. =================================================================== */ /* Smooth the swap; never animate layout */ html[class*="wtk-"] body{transition:background .25s ease,color .25s ease} html[class*="wtk-"] body,html[class*="wtk-"]{background:var(--bg)} /* ---- shared helper: kit wordmark + picker chrome live at bottom ---- */ #wt-skinbar{position:fixed;right:14px;bottom:14px;z-index:2147483400;display:flex;align-items:center;gap:3px;padding:6px 8px;border-radius:999px;background:rgba(20,20,24,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.16);box-shadow:0 8px 28px rgba(0,0,0,.45);font-family:system-ui,-apple-system,Segoe UI,sans-serif;max-width:calc(100vw - 18px);overflow-x:auto;scrollbar-width:none} #wt-skinbar::-webkit-scrollbar{display:none} #wt-skinbar .l{color:#cfd4dd;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:0 5px;white-space:nowrap} #wt-skinbar button{cursor:pointer;white-space:nowrap;font-size:12px;font-weight:600;color:#e9edf3;background:transparent;border:1px solid transparent;border-radius:999px;padding:5px 11px;font-family:inherit;line-height:1} #wt-skinbar button:hover{background:rgba(255,255,255,.1)} #wt-skinbar button[aria-current="true"]{background:var(--ac,#d97757);border-color:var(--ac,#d97757);color:#fff} @media(max-width:560px){#wt-skinbar .l{display:none}} /* =================================================================== KIT 1 — BROADSHEET (editorial newspaper: civic, news, tech-news) =================================================================== */ html.wtk-broadsheet{--h:'Fraunces',Georgia,serif;--b:'Newsreader',Georgia,serif;--r:0px} html.wtk-broadsheet .hero{border-bottom:3px double var(--bd,var(--border));padding-bottom:34px} html.wtk-broadsheet .hero h1{font-weight:600;letter-spacing:-.5px;line-height:1.05} html.wtk-broadsheet h2{border-bottom:1px solid var(--bd,var(--border));padding-bottom:6px;font-weight:600} html.wtk-broadsheet .card{border-radius:0;border:0;border-top:2px solid var(--tx,var(--text));background:transparent;padding:18px 16px 18px 0} html.wtk-broadsheet .card:hover{border-color:var(--ac,var(--accent));transform:none} html.wtk-broadsheet .nav{border-bottom:1px solid var(--bd,var(--border))} html.wtk-broadsheet .nl{font-family:var(--h);font-weight:600;letter-spacing:0} html.wtk-broadsheet.wtt-1{--bg:#f7f3ea;--sf:#fffdf7;--surface:#fffdf7;--s2:#efe9da;--bd:#d9cfb8;--border:#d9cfb8;--tx:#1d1a14;--text:#1d1a14;--dm:#544e42;--dim:#544e42;--mt:#857c6a;--muted:#857c6a;--ac:#9a1f15;--accent:#9a1f15;--acd:rgba(154,31,21,.06);--green:#1d6b3f;--teal:#155e75;--purple:#5b3d8f;--amber:#9a6a15;--gold:#9a6a15;--coral:#9a1f15} html.wtk-broadsheet.wtt-2{--bg:#15140f;--sf:#1d1b14;--surface:#1d1b14;--s2:#24221a;--bd:#363225;--border:#363225;--tx:#ece6d6;--text:#ece6d6;--dm:#b3ab97;--dim:#b3ab97;--mt:#7d7563;--muted:#7d7563;--ac:#e0a23a;--accent:#e0a23a;--acd:rgba(224,162,58,.08);--green:#6cc08a;--teal:#5fb0c4;--purple:#b59ae0;--amber:#e0a23a;--gold:#e0a23a;--coral:#e07a5f} html.wtk-broadsheet.wtt-3{--bg:#ece0c8;--sf:#f5ecd8;--surface:#f5ecd8;--s2:#e2d4b6;--bd:#c9b896;--border:#c9b896;--tx:#3a2f1c;--text:#3a2f1c;--dm:#6e5f45;--dim:#6e5f45;--mt:#988663;--muted:#988663;--ac:#8a4b1e;--accent:#8a4b1e;--acd:rgba(138,75,30,.07);--green:#5a6b2f;--teal:#3f6b5e;--purple:#6b4b7a;--amber:#8a6a1e;--gold:#8a6a1e;--coral:#8a4b1e} html.wtk-broadsheet.wtt-4{--bg:#eef1f4;--sf:#ffffff;--surface:#ffffff;--s2:#e2e7ec;--bd:#cbd3dc;--border:#cbd3dc;--tx:#16202b;--text:#16202b;--dm:#475563;--dim:#475563;--mt:#76828f;--muted:#76828f;--ac:#1f4e79;--accent:#1f4e79;--acd:rgba(31,78,121,.06);--green:#1d6b54;--teal:#155e75;--purple:#4a3d8f;--amber:#8a5a15;--gold:#8a5a15;--coral:#b23a48} html.wtk-broadsheet.wtt-5{--bg:#ffffff;--sf:#ffffff;--surface:#ffffff;--s2:#f0f0f0;--bd:#111111;--border:#111111;--tx:#0a0a0a;--text:#0a0a0a;--dm:#3d3d3d;--dim:#3d3d3d;--mt:#6e6e6e;--muted:#6e6e6e;--ac:#d11500;--accent:#d11500;--acd:rgba(209,21,0,.06);--green:#0a7a3d;--teal:#066;--purple:#52269e;--amber:#9a6a00;--gold:#9a6a00;--coral:#d11500} /* =================================================================== KIT 2 — ALMANAC (warm field-guide: Austin/Texas guides, travel, retire) =================================================================== */ html.wtk-almanac{--h:'Zilla Slab',Rockwell,serif;--b:'Bitter',Georgia,serif;--r:6px} html.wtk-almanac .hero h1{font-weight:700;letter-spacing:-.3px} html.wtk-almanac h2{font-weight:600} html.wtk-almanac .card{border-radius:6px;border:1px solid var(--bd,var(--border));border-left:4px solid var(--ac,var(--accent))} html.wtk-almanac .card:hover{border-left-color:var(--ac,var(--accent));transform:translateY(-2px)} html.wtk-almanac .nl{font-family:var(--h);font-weight:700} html.wtk-almanac.wtt-1{--bg:#f4f0e4;--sf:#fbf8ef;--surface:#fbf8ef;--s2:#eae3d1;--bd:#d6cbb1;--border:#d6cbb1;--tx:#23271c;--text:#23271c;--dm:#535b46;--dim:#535b46;--mt:#83886f;--muted:#83886f;--ac:#3f6b35;--accent:#3f6b35;--acd:rgba(63,107,53,.07);--green:#3f6b35;--teal:#2f6b5e;--purple:#6a4b8a;--amber:#a9701e;--gold:#a9701e;--coral:#b04a2f} html.wtk-almanac.wtt-2{--bg:#1a1510;--sf:#231c14;--surface:#231c14;--s2:#2c241a;--bd:#3e3324;--border:#3e3324;--tx:#efe6d4;--text:#efe6d4;--dm:#bcae93;--dim:#bcae93;--mt:#897c63;--muted:#897c63;--ac:#e0a93a;--accent:#e0a93a;--acd:rgba(224,169,58,.08);--green:#8bbf6a;--teal:#5fb0a0;--purple:#bfa0e0;--amber:#e0a93a;--gold:#e0a93a;--coral:#e0825f} html.wtk-almanac.wtt-3{--bg:#eef0f5;--sf:#f8f9fc;--surface:#f8f9fc;--s2:#e0e4ee;--bd:#c9cfe0;--border:#c9cfe0;--tx:#1b2030;--text:#1b2030;--dm:#4a536b;--dim:#4a536b;--mt:#79809a;--muted:#79809a;--ac:#3a4f9a;--accent:#3a4f9a;--acd:rgba(58,79,154,.06);--green:#2f7a54;--teal:#246b8a;--purple:#3a4f9a;--amber:#8a6a1e;--gold:#8a6a1e;--coral:#b23a6a} html.wtk-almanac.wtt-4{--bg:#f3e7dd;--sf:#fbf2ea;--surface:#fbf2ea;--s2:#ecd8c8;--bd:#dcc0aa;--border:#dcc0aa;--tx:#2e1d14;--text:#2e1d14;--dm:#6a4836;--dim:#6a4836;--mt:#9a715a;--muted:#9a715a;--ac:#b4502a;--accent:#b4502a;--acd:rgba(180,80,42,.07);--green:#6a7a2f;--teal:#3f7a6e;--purple:#7a4b6a;--amber:#b47a2a;--gold:#b47a2a;--coral:#b4502a} html.wtk-almanac.wtt-5{--bg:#e6efe9;--sf:#f1f7f2;--surface:#f1f7f2;--s2:#d6e6da;--bd:#bdd4c4;--border:#bdd4c4;--tx:#152119;--text:#152119;--dm:#3f5847;--dim:#3f5847;--mt:#6e8676;--muted:#6e8676;--ac:#2c7a6a;--accent:#2c7a6a;--acd:rgba(44,122,106,.07);--green:#2f7a3f;--teal:#2c7a6a;--purple:#5a4b8a;--amber:#8a6a1e;--gold:#8a6a1e;--coral:#a8503f} /* =================================================================== KIT 3 — TERMINAL (mono/retro: AI tools, robots, ham radio, dev, cyber) =================================================================== */ html.wtk-terminal{--h:'Space Mono',ui-monospace,monospace;--b:'IBM Plex Mono',ui-monospace,monospace;--r:2px} html.wtk-terminal .hero h1{font-weight:700;letter-spacing:-1px;text-transform:none} html.wtk-terminal h2:before{content:"> ";color:var(--ac,var(--accent))} html.wtk-terminal .card{border-radius:2px;border:1px solid var(--bd,var(--border));background:var(--s2)} html.wtk-terminal .card h3:before{content:"# ";color:var(--ac,var(--accent));opacity:.6} html.wtk-terminal .nl{font-family:var(--h);letter-spacing:-.5px} html.wtk-terminal.wtt-1{--bg:#050a06;--sf:#0a140c;--surface:#0a140c;--s2:#0e1a10;--bd:#1c3a22;--border:#1c3a22;--tx:#86f6a6;--text:#86f6a6;--dm:#4fc873;--dim:#4fc873;--mt:#2f8448;--muted:#2f8448;--ac:#86f6a6;--accent:#86f6a6;--acd:rgba(134,246,166,.07);--green:#86f6a6;--teal:#5eead4;--purple:#9dff7d;--amber:#d7ff5c;--gold:#d7ff5c;--coral:#ff8b8b} html.wtk-terminal.wtt-2{--bg:#0a0700;--sf:#140f04;--surface:#140f04;--s2:#1a1308;--bd:#3a2c12;--border:#3a2c12;--tx:#ffcf8a;--text:#ffcf8a;--dm:#d49a4f;--dim:#d49a4f;--mt:#8a662f;--muted:#8a662f;--ac:#ffb13a;--accent:#ffb13a;--acd:rgba(255,177,58,.08);--green:#d7c05c;--teal:#e0b06a;--purple:#ffcf8a;--amber:#ffb13a;--gold:#ffb13a;--coral:#ff9b6a} html.wtk-terminal.wtt-3{--bg:#eceae3;--sf:#f6f4ee;--surface:#f6f4ee;--s2:#e0ddd2;--bd:#cbc7b8;--border:#cbc7b8;--tx:#16140d;--text:#16140d;--dm:#4a4636;--dim:#4a4636;--mt:#7a7563;--muted:#7a7563;--ac:#1f5e3a;--accent:#1f5e3a;--acd:rgba(31,94,58,.06);--green:#1f5e3a;--teal:#155e6e;--purple:#4a3d7a;--amber:#7a5a15;--gold:#7a5a15;--coral:#a83a2f} html.wtk-terminal.wtt-4{--bg:#040810;--sf:#08101e;--surface:#08101e;--s2:#0c1726;--bd:#1c3050;--border:#1c3050;--tx:#a6d8ff;--text:#a6d8ff;--dm:#5f9fd4;--dim:#5f9fd4;--mt:#2f6491;--muted:#2f6491;--ac:#38bdf8;--accent:#38bdf8;--acd:rgba(56,189,248,.08);--green:#5eead4;--teal:#38bdf8;--purple:#a78bfa;--amber:#7dd3fc;--gold:#7dd3fc;--coral:#fb7185} html.wtk-terminal.wtt-5{--bg:#0a0410;--sf:#13081e;--surface:#13081e;--s2:#1a0c26;--bd:#3a1c50;--border:#3a1c50;--tx:#f0a6ff;--text:#f0a6ff;--dm:#c45fd4;--dim:#c45fd4;--mt:#842f91;--muted:#842f91;--ac:#e23ef8;--accent:#e23ef8;--acd:rgba(226,62,248,.08);--green:#9dff7d;--teal:#5eead4;--purple:#e23ef8;--amber:#ffb13a;--gold:#ffb13a;--coral:#fb7185} /* =================================================================== KIT 4 — SHOWROOM (clean listing/showcase: real-estate, coworking, market) =================================================================== */ html.wtk-showroom{--h:'Big Shoulders Display',Impact,sans-serif;--b:'Libre Franklin',system-ui,sans-serif;--r:4px} html.wtk-showroom .hero h1{font-weight:800;letter-spacing:-.5px;text-transform:uppercase} html.wtk-showroom h2{font-weight:700;text-transform:uppercase;letter-spacing:.02em} html.wtk-showroom .card{border-radius:4px;border:1px solid var(--bd,var(--border));box-shadow:0 1px 0 var(--bd,var(--border))} html.wtk-showroom .card:hover{box-shadow:0 6px 24px rgba(0,0,0,.12)} html.wtk-showroom .nl{font-family:var(--h);font-weight:800;text-transform:uppercase;letter-spacing:.02em} html.wtk-showroom.wtt-1{--bg:#f3f5f8;--sf:#ffffff;--surface:#ffffff;--s2:#e7ebf1;--bd:#d2d9e2;--border:#d2d9e2;--tx:#101722;--text:#101722;--dm:#465263;--dim:#465263;--mt:#76808f;--muted:#76808f;--ac:#1d6fb8;--accent:#1d6fb8;--acd:rgba(29,111,184,.06);--green:#1d8a5a;--teal:#1d6fb8;--purple:#5a4bb8;--amber:#b88a1d;--gold:#b88a1d;--coral:#c4455a} html.wtk-showroom.wtt-2{--bg:#0b1422;--sf:#101d30;--surface:#101d30;--s2:#16263c;--bd:#243a56;--border:#243a56;--tx:#dce8f6;--text:#dce8f6;--dm:#9fb4cf;--dim:#9fb4cf;--mt:#64789a;--muted:#64789a;--ac:#38bdf8;--accent:#38bdf8;--acd:rgba(56,189,248,.08);--green:#34d399;--teal:#38bdf8;--purple:#a78bfa;--amber:#fbbf24;--gold:#fbbf24;--coral:#fb7185} html.wtk-showroom.wtt-3{--bg:#f0ebe0;--sf:#f9f5ec;--surface:#f9f5ec;--s2:#e6dfce;--bd:#d2c8b0;--border:#d2c8b0;--tx:#221d14;--text:#221d14;--dm:#574e3c;--dim:#574e3c;--mt:#897f66;--muted:#897f66;--ac:#9a5a1e;--accent:#9a5a1e;--acd:rgba(154,90,30,.07);--green:#5a7a2f;--teal:#3f6b6e;--purple:#6a4b7a;--amber:#9a7a1e;--gold:#9a7a1e;--coral:#a8503f} html.wtk-showroom.wtt-4{--bg:#16130d;--sf:#1e1a12;--surface:#1e1a12;--s2:#262017;--bd:#3a3124;--border:#3a3124;--tx:#efe7d6;--text:#efe7d6;--dm:#b8ac93;--dim:#b8ac93;--mt:#857a63;--muted:#857a63;--ac:#d4a843;--accent:#d4a843;--acd:rgba(212,168,67,.08);--green:#9bbf6a;--teal:#6ab0a0;--purple:#bfa0e0;--amber:#d4a843;--gold:#d4a843;--coral:#e0825f} html.wtk-showroom.wtt-5{--bg:#eaf1ec;--sf:#f4f9f5;--surface:#f4f9f5;--s2:#dbe7df;--bd:#c2d6c8;--border:#c2d6c8;--tx:#132019;--text:#132019;--dm:#3d5747;--dim:#3d5747;--mt:#6c8576;--muted:#6c8576;--ac:#2c8a5a;--accent:#2c8a5a;--acd:rgba(44,138,90,.07);--green:#2c8a5a;--teal:#2c7a8a;--purple:#5a4b9a;--amber:#8a6a1e;--gold:#8a6a1e;--coral:#a8503f} /* =================================================================== KIT 5 — MARQUEE (poster/entertainment: TV/media, festivals, audition, nightlife, podcasts) =================================================================== */ html.wtk-marquee{--h:'Anton',Impact,sans-serif;--b:'Archivo',system-ui,sans-serif;--r:3px} html.wtk-marquee .hero h1{font-weight:400;letter-spacing:.5px;text-transform:uppercase;line-height:.98} html.wtk-marquee h2{font-family:var(--h);font-weight:400;text-transform:uppercase;letter-spacing:.04em} html.wtk-marquee .card{border-radius:3px;border:1px solid var(--bd,var(--border))} html.wtk-marquee .card:hover{border-color:var(--ac,var(--accent));transform:translateY(-3px)} html.wtk-marquee .nl{font-family:var(--h);font-weight:400;text-transform:uppercase;letter-spacing:.05em} html.wtk-marquee.wtt-1{--bg:#0c0a0a;--sf:#161212;--surface:#161212;--s2:#1e1818;--bd:#352828;--border:#352828;--tx:#f4ece6;--text:#f4ece6;--dm:#bba9a0;--dim:#bba9a0;--mt:#82706a;--muted:#82706a;--ac:#e23b2e;--accent:#e23b2e;--acd:rgba(226,59,46,.08);--green:#5fbf7a;--teal:#5fb0c4;--purple:#b59ae0;--amber:#e0a23a;--gold:#e0a23a;--coral:#e23b2e} html.wtk-marquee.wtt-2{--bg:#08060f;--sf:#100b1c;--surface:#100b1c;--s2:#171026;--bd:#2c1c4a;--border:#2c1c4a;--tx:#ecdfff;--text:#ecdfff;--dm:#b89fd4;--dim:#b89fd4;--mt:#7a5f9a;--muted:#7a5f9a;--ac:#ff2bd6;--accent:#ff2bd6;--acd:rgba(255,43,214,.08);--green:#5eead4;--teal:#22d3ee;--purple:#ff2bd6;--amber:#fbbf24;--gold:#fbbf24;--coral:#fb7185} html.wtk-marquee.wtt-3{--bg:#f2ece0;--sf:#faf5ea;--surface:#faf5ea;--s2:#e8e0cd;--bd:#d6ccb2;--border:#d6ccb2;--tx:#1c1810;--text:#1c1810;--dm:#4e4736;--dim:#4e4736;--mt:#827964;--muted:#827964;--ac:#d11f5a;--accent:#d11f5a;--acd:rgba(209,31,90,.06);--green:#2f7a4a;--teal:#1f6e8a;--purple:#6a3d9a;--amber:#b4801e;--gold:#b4801e;--coral:#d11f5a} html.wtk-marquee.wtt-4{--bg:#120a16;--sf:#1c1022;--surface:#1c1022;--s2:#24162c;--bd:#3e2848;--border:#3e2848;--tx:#f0e6d2;--text:#f0e6d2;--dm:#c4ab93;--dim:#c4ab93;--mt:#8a7060;--muted:#8a7060;--ac:#e0b13a;--accent:#e0b13a;--acd:rgba(224,177,58,.08);--green:#9bbf6a;--teal:#6ab0c4;--purple:#c49ae0;--amber:#e0b13a;--gold:#e0b13a;--coral:#e0728f} html.wtk-marquee.wtt-5{--bg:#1a0f06;--sf:#241608;--surface:#241608;--s2:#2c1c0c;--bd:#42301a;--border:#42301a;--tx:#f6e8d6;--text:#f6e8d6;--dm:#c9ab8a;--dim:#c9ab8a;--mt:#8f7355;--muted:#8f7355;--ac:#f07b1e;--accent:#f07b1e;--acd:rgba(240,123,30,.08);--green:#9bbf5c;--teal:#6ab0a0;--purple:#bf9ae0;--amber:#f0a81e;--gold:#f0a81e;--coral:#f07b1e} /* =================================================================== KIT 6 — STUDIO (modern design-forward: startup, web art, presentations, women-in-tech, misc) =================================================================== */ html.wtk-studio{--h:'Bricolage Grotesque',system-ui,sans-serif;--b:'Inter Tight',system-ui,sans-serif;--r:14px} html.wtk-studio .hero h1{font-weight:700;letter-spacing:-1.5px;line-height:1.02} html.wtk-studio h2{font-weight:600;letter-spacing:-.5px} html.wtk-studio .card{border-radius:14px;border:1px solid var(--bd,var(--border))} html.wtk-studio .card:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.14)} html.wtk-studio .nl{font-family:var(--h);font-weight:700;letter-spacing:-.5px} html.wtk-studio.wtt-1{--bg:#fbfbf9;--sf:#ffffff;--surface:#ffffff;--s2:#f0f0ec;--bd:#e2e2dc;--border:#e2e2dc;--tx:#111110;--text:#111110;--dm:#4a4a46;--dim:#4a4a46;--mt:#7a7a74;--muted:#7a7a74;--ac:#4f39f6;--accent:#4f39f6;--acd:rgba(79,57,246,.05);--green:#1d8a5a;--teal:#0e7490;--purple:#4f39f6;--amber:#b8801d;--gold:#b8801d;--coral:#e23b6a} html.wtk-studio.wtt-2{--bg:#0c0a14;--sf:#13101f;--surface:#13101f;--s2:#191428;--bd:#2a2342;--border:#2a2342;--tx:#ece9f6;--text:#ece9f6;--dm:#aca4cf;--dim:#aca4cf;--mt:#6f6699;--muted:#6f6699;--ac:#8b7bff;--accent:#8b7bff;--acd:rgba(139,123,255,.08);--green:#34d399;--teal:#22d3ee;--purple:#8b7bff;--amber:#fbbf24;--gold:#fbbf24;--coral:#fb7185} html.wtk-studio.wtt-3{--bg:#f4f0ea;--sf:#fdfbf6;--surface:#fdfbf6;--s2:#e9e2d6;--bd:#dccfbb;--border:#dccfbb;--tx:#1a1712;--text:#1a1712;--dm:#4e4636;--dim:#4e4636;--mt:#827964;--muted:#827964;--ac:#2f4fd1;--accent:#2f4fd1;--acd:rgba(47,79,209,.05);--green:#2f7a4a;--teal:#1f6e8a;--purple:#6a3d9a;--amber:#b4801e;--gold:#b4801e;--coral:#e2557a} html.wtk-studio.wtt-4{--bg:#e9f2f0;--sf:#f3f9f8;--surface:#f3f9f8;--s2:#d8e8e4;--bd:#bfd9d2;--border:#bfd9d2;--tx:#0f1f1c;--text:#0f1f1c;--dm:#3d5752;--dim:#3d5752;--mt:#6c8681;--muted:#6c8681;--ac:#0d9488;--accent:#0d9488;--acd:rgba(13,148,136,.06);--green:#2c8a5a;--teal:#0d9488;--purple:#5a4b9a;--amber:#8a6a1e;--gold:#8a6a1e;--coral:#d6455a} html.wtk-studio.wtt-5{--bg:#0a0c08;--sf:#11140d;--surface:#11140d;--s2:#171b11;--bd:#2a3020;--border:#2a3020;--tx:#e9f0df;--text:#e9f0df;--dm:#aab89a;--dim:#aab89a;--mt:#6f7d5f;--muted:#6f7d5f;--ac:#a3e635;--accent:#a3e635;--acd:rgba(163,230,53,.08);--green:#a3e635;--teal:#5eead4;--purple:#c4b5fd;--amber:#facc15;--gold:#facc15;--coral:#fb7185}