/* AIZone. Near-black interface divided by hairlines, one violet accent, cut corners. The amber highlight marks the blanks in a prompt. */
@font-face{font-family:"Exo 2";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/exo-2-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Exo 2";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/exo-2-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --page:#2A2C38; --app:#141417; --panel:#1D1D22; --panel-2:#27272E; --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.18);
  --text:#F5F5F7; --soft:#C5C6CE; --muted:#8D8F9B;
  --accent:#8B5CF6; --accent-2:#A78BFA; --hot:#EF4444; --mark:#FFD84D; --ink:#141417;
  --display:"Exo 2",system-ui,sans-serif; --body:"Exo 2",system-ui,sans-serif;
  --gap:28px; --cut:14px;
  --cut-shape:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;color-scheme:dark}
body{margin:0;color:var(--text);font:400 1rem/1.6 var(--body);min-height:100vh;background:var(--page)}
img{max-width:100%;height:auto}
a{color:var(--accent-2);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:var(--ink);padding:.5rem 1rem;z-index:90}
.muted{color:var(--muted);font-size:.92rem}
.ico{flex:none}

/* the app window: three columns separated by hairlines */
.app{max-width:1480px;margin:var(--gap) auto;min-height:calc(100vh - 2*var(--gap));border-radius:14px;overflow:clip;display:grid;grid-template-columns:248px minmax(0,1fr) 300px;background:var(--app);box-shadow:0 40px 80px -30px rgba(0,0,0,.7)}
.wrap{padding-inline:clamp(1rem,2.4vw,2rem)}

h1,h2,h3{font-family:var(--display);line-height:1.15;letter-spacing:-.01em;margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(1.9rem,3.4vw,2.7rem);max-width:22ch}
h1.page-title{font-size:1.1rem;font-weight:600;color:var(--muted);letter-spacing:0;margin-bottom:1rem;max-width:none}
h2{font-size:clamp(1.2rem,1.9vw,1.45rem);font-weight:600}
h3{font-size:1.05rem;font-weight:600;letter-spacing:0}
p{margin:0 0 1em}
.lead{font-size:1.08rem;max-width:62ch;color:var(--soft)}
.lead-block{max-width:74ch;color:var(--soft);margin-bottom:1.6rem}.lead-block>*:last-child{margin-bottom:0}
.prose{max-width:72ch;color:var(--soft)}.prose h2,.prose strong{color:var(--text)}
.prose ul,.prose ol{padding-left:1.2em}.prose li{margin-bottom:.4em}
.page{max-width:76ch}.page h2{margin-top:1.6em}

/* sidebar */
.sidebar{position:sticky;top:0;align-self:start;height:calc(100vh - 2*var(--gap));padding:0 0 1rem;overflow-y:auto;scrollbar-width:none;display:flex;flex-direction:column;border-right:1px solid var(--line)}
.sidebar::-webkit-scrollbar,.rail::-webkit-scrollbar{display:none}
.sidebar nav{flex:1;padding:1rem .9rem 0}
.brand{font:700 1.35rem var(--display);color:var(--text);text-decoration:none;display:flex;align-items:center;gap:.65rem;margin:0;height:4.4rem;padding:0 1.3rem;border-bottom:1px solid var(--line)}
.brand-mark{background:var(--accent);color:#fff;padding:.12em .42em;font-weight:800;letter-spacing:.04em;font-size:.82em;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,0 100%)}
.sidebar h2{font:600 .98rem var(--body);color:var(--text);margin:0 .5rem .5rem;padding-top:1.1rem;border-top:1px solid var(--line)}
.side-nav{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:2px}
.side-nav--foot{padding-top:.8rem;border-top:1px solid var(--line)}
.side-nav a,.side-nav .linklike{display:flex;align-items:center;gap:.8rem;width:100%;padding:.5rem .7rem;color:var(--soft);text-decoration:none;font-weight:500;font-size:.97rem;text-align:left;--cut:8px}
.side-nav a:hover,.side-nav .linklike:hover{color:#fff;background:rgba(255,255,255,.04)}
.side-nav a[aria-current]{color:#fff;background:var(--panel-2);clip-path:var(--cut-shape);font-weight:600}
.chipl{flex:none;width:20px;height:20px;display:grid;place-items:center;font:700 .68rem var(--body);font-style:normal;color:var(--accent-2);border:1px solid rgba(167,139,250,.45);border-radius:3px}
.badge{margin-left:auto;font:600 .72rem var(--body);background:var(--panel-2);color:var(--soft);border-radius:4px;min-width:1.5rem;padding:.08rem .4rem;text-align:center}
.badge--hot{background:var(--hot);color:#fff;text-transform:uppercase;font-size:.66rem;letter-spacing:.03em}

/* top bar */
.main-col{min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;gap:.8rem;height:4.4rem;padding:0 clamp(1rem,2.4vw,2rem);border-bottom:1px solid var(--line)}
.top-search{flex:1;max-width:34rem;position:relative}
.top-search input{width:100%;font:inherit;font-size:.97rem;color:var(--text);background:var(--panel);border:0;padding:.66rem 1rem .66rem 2.7rem;--cut:10px;clip-path:var(--cut-shape)}
.top-search input::placeholder{color:var(--muted)}
.top-search .ico{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.icon-btn{position:relative;margin-left:auto;display:grid;place-items:center;width:2.6rem;height:2.6rem;background:var(--panel);border:0;color:var(--text);cursor:pointer;text-decoration:none;flex:none;border-radius:6px}
.icon-btn:hover{background:var(--panel-2)}
.icon-btn .badge{position:absolute;top:-5px;right:-6px;margin:0;border-radius:99px}
.menu-btn{display:none;margin-left:0}
main{padding-block:1.6rem 2.5rem;flex:1;width:100%}
.crumbs{font-size:.86rem;color:var(--muted);margin-bottom:1rem;display:flex;gap:.5rem;flex-wrap:wrap}
.crumbs a{color:var(--muted)}
.section{margin-top:2.6rem}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.section-head h2{margin:0}
.section-head a{font-weight:500;font-size:.92rem}

/* buttons: cut corners, the primary one is white like a play button */
.btn{font:600 .96rem var(--body);display:inline-flex;align-items:center;gap:.45rem;padding:.62rem 1.15rem;border:0;background:var(--panel-2);color:var(--text);cursor:pointer;text-decoration:none;--cut:9px;clip-path:var(--cut-shape)}
.btn:hover{background:#34343D}
.btn--primary{background:#fff;color:var(--ink)}
.btn--primary:hover{background:#E6E0FF}
.btn--quiet{background:transparent;box-shadow:inset 0 0 0 1px var(--line-2);clip-path:none;border-radius:4px;padding:.4rem .75rem;font-size:.88rem;font-weight:500}
.btn--quiet:hover{background:var(--panel-2)}
.btn:focus-visible,.side-nav a:focus-visible,.top-search input:focus-visible,.thumb:focus-visible{outline-offset:-3px}
.linklike{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer}
.fav{font:500 .82rem var(--body);background:none;border:1px solid var(--line-2);border-radius:4px;padding:.18rem .65rem;cursor:pointer;color:var(--soft)}
.fav:hover{color:#fff;border-color:var(--accent-2)}
.fav[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff}

/* hero: violet edge on the left and bottom, cut corner, the prompt itself as backdrop */
.feature{--cut:34px;background:var(--accent);padding:0 0 7px 7px;clip-path:var(--cut-shape)}
.feature-in{position:relative;min-height:25rem;background:#0F0F12;clip-path:var(--cut-shape);padding:1.6rem clamp(1.2rem,3vw,2.4rem) 2rem;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.feature-bg{position:absolute;inset:-1rem -2rem auto 47%;font:500 1.55rem/1.75 var(--body);color:rgba(255,255,255,.2);white-space:pre-wrap;transform:rotate(-4deg);transform-origin:top right;pointer-events:none;-webkit-mask-image:linear-gradient(100deg,transparent 2%,#000 45%);mask-image:linear-gradient(100deg,transparent 2%,#000 45%)}
.feature-bg mark{background:var(--mark);color:var(--ink);padding:0 .25em;font-weight:700;opacity:.92}
.feature-in>*:not(.feature-bg){position:relative}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 auto}
.chip{font-size:.82rem;font-weight:600;padding:.25rem .75rem;border-radius:99px;background:rgba(255,255,255,.14);color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.chip--hot{background:var(--hot);text-transform:uppercase;letter-spacing:.04em;font-size:.76rem;display:inline-flex;align-items:center}
.feature h3{font-size:clamp(2rem,4.6vw,3.4rem);font-weight:700;line-height:1.08;margin:2.5rem 0 .6rem;max-width:14ch;text-shadow:0 2px 24px #0F0F12}
.feature h3 a{color:#fff;text-decoration:none}.feature h3 a:hover{text-decoration:underline;text-decoration-thickness:3px}
.feature-sum{margin:0 0 .8rem;max-width:44ch;color:#E4E4EA;text-shadow:0 1px 14px #0F0F12}
.feature-by{display:flex;gap:1rem;flex-wrap:wrap;margin:0 0 1.3rem;font-size:.93rem;color:var(--soft)}
.feature-by a{color:#fff;font-weight:600;text-decoration:none}
.feature-actions{display:flex;gap:.8rem;align-items:center}
.feature-actions .btn--primary{padding:.75rem 1.5rem;font-size:1.02rem}

/* tiles: the thumbnail is the prompt, the title sits underneath */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:1.6rem 1.2rem}
.tile{display:flex;flex-direction:column;min-width:0}
.thumb{position:relative;display:block;aspect-ratio:16/10;background:var(--panel);overflow:hidden;text-decoration:none;--cut:16px;clip-path:var(--cut-shape)}
.thumb-text{position:absolute;inset:2.4rem .95rem 0;font-size:.8rem;line-height:1.6;color:#B9BAC4;-webkit-mask-image:linear-gradient(#000 45%,transparent 98%);mask-image:linear-gradient(#000 45%,transparent 98%)}
.thumb-text mark{background:var(--mark);color:var(--ink);padding:0 .25em;font-weight:700;border-radius:2px}
.thumb--img{background-size:cover;background-position:center}
.thumb::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 2px transparent;transition:box-shadow .12s}
.tile:hover .thumb::after{box-shadow:inset 3px -3px 0 var(--accent)}
.tag{position:absolute;top:.6rem;font-size:.72rem;font-weight:600;padding:.12rem .5rem;border-radius:4px;background:rgba(20,20,23,.82);color:#fff}
.tag--tl{left:.6rem}.tag--tr{right:1.3rem}
.tag--halado{background:var(--accent)}.tag--profi{background:var(--hot)}
.tile-body{padding-top:.7rem;display:flex;flex-direction:column;flex:1}
.tile h3{margin:0 0 .25rem}
.tile h3 a{color:#fff;text-decoration:none}
.tile h3 a:hover{text-decoration:underline}
.tile-sum{margin:0 0 .6rem;font-size:.9rem;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tile-meta{margin:auto 0 0;display:flex;justify-content:space-between;align-items:center;font-size:.86rem}
.tile-meta a{color:var(--soft);text-decoration:none}.tile-meta a:hover{color:var(--accent-2)}
.empty{border:1px dashed var(--line-2);padding:1.5rem;text-align:center;color:var(--soft)}

/* lists: rows and hairlines instead of boxes */
.topic-list,.flow-list,.pill-list,.followups,.rail-list,.news-list,.feature-list{list-style:none;padding:0;margin:0}
.topic-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:0 2rem;border-top:1px solid var(--line)}
.topic-list a{display:grid;grid-template-columns:1fr auto;gap:.1rem .8rem;padding:.9rem 0;color:var(--text);text-decoration:none;height:100%;border-bottom:1px solid var(--line)}
.topic-list strong{font:600 1.08rem var(--display)}
.topic-list span{color:var(--soft);font-size:.74rem;font-weight:600;align-self:center;background:var(--panel-2);border-radius:4px;padding:.08rem .45rem}
.topic-list em{grid-column:1/-1;font-style:normal;color:var(--muted);font-size:.88rem}
.topic-list a:hover strong,.flow-list a:hover strong,.news-list a:hover strong{color:var(--accent-2)}
.flow-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:0 2rem;border-top:1px solid var(--line)}
.flow-list a{display:block;color:var(--text);padding:.9rem 0;text-decoration:none;height:100%;border-bottom:1px solid var(--line)}
.flow-list strong{display:block;font:600 1.05rem var(--display)}
.flow-list span,.flow-list em{display:block;font-style:normal;color:var(--muted);font-size:.9rem;margin-top:.2rem}
.pill-list{display:flex;flex-wrap:wrap;gap:.5rem}
.pill-list a{display:inline-block;padding:.38rem .9rem;color:var(--text);text-decoration:none;font-weight:500;background:var(--panel);font-size:.93rem;--cut:8px;clip-path:var(--cut-shape)}
.pill-list a:hover{background:var(--panel-2)}
.news-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:0 2rem;border-top:1px solid var(--line)}
.news-list a{display:grid;gap:.25rem;height:100%;padding:1rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--muted);font-size:.92rem;align-content:start}
.news-list strong{font:600 1.08rem/1.3 var(--display);color:#fff}
.news-meta{font-size:.8rem;font-weight:600;color:var(--accent-2)}
.news-list--full{grid-template-columns:1fr;max-width:54rem}
.feature-list{display:grid;gap:0;margin:1rem 0;max-width:54rem;border-top:1px solid var(--line)}
.feature-list li{padding:.9rem 0 .9rem 1rem;color:var(--soft);border-bottom:1px solid var(--line);border-left:3px solid var(--accent)}
.feature-list strong{display:block;color:#fff;font:600 1.02rem var(--display);margin-bottom:.15rem}
.sources{font-size:.9rem;color:var(--muted)}.sources ul{padding-left:1.2em;margin:.3rem 0 0}

/* filters */
.filters{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:.8rem;align-items:end;margin:1.2rem 0 .8rem}
.field span,.filters label span,.note span{display:block;font-weight:500;font-size:.86rem;margin-bottom:.25rem;color:var(--soft)}
.field textarea,.filters input[type=search],.filters select,.note textarea{width:100%;font:inherit;font-size:.96rem;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:.58rem .75rem}
.field textarea::placeholder,.filters input::placeholder,.note textarea::placeholder{color:#74767F}
.field textarea:focus,.filters input:focus,.filters select:focus,.note textarea:focus{border-color:var(--accent-2);outline:0;box-shadow:0 0 0 3px rgba(139,92,246,.28)}
select option{background:var(--panel);color:#fff}
.f-check{display:flex;align-items:center;gap:.4rem;padding-bottom:.6rem}.f-check span{margin:0!important;font-size:.92rem!important}
.f-check input{accent-color:var(--accent);width:1rem;height:1rem}

/* the prompt tool */
.ptool{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:1.4rem;margin-top:1.5rem;align-items:start}
.ptool-fields{border:1px solid var(--line);padding:1.2rem}
.ptool-fields h2{font-size:1.05rem;margin-bottom:.9rem}
.field{display:block;margin-bottom:.85rem}
.field textarea{resize:vertical;min-height:2.7rem;line-height:1.45}
.field textarea:placeholder-shown{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ptool-fieldactions{display:flex;gap:.5rem;flex-wrap:wrap;margin:0}
.sheet{position:relative;background:#0F0F12;border-left:5px solid var(--accent);border-bottom:5px solid var(--accent);padding:1.3rem 1.5rem;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;font-size:.99rem;color:#E9E9EE;--cut:22px;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.sheet mark{background:var(--mark);color:var(--ink);padding:.06em .32em;border-radius:3px;font-weight:700}
.sheet .filled{background:rgba(139,92,246,.2);box-shadow:inset 0 -2px 0 var(--accent-2);padding:.06em .25em;color:#fff}
.ptool-actions{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:.9rem}
.ptool-hint{margin:.6rem 0 0}
.lang-switch{display:inline-flex;gap:2px;margin-bottom:.6rem}
.lang-switch button{font:500 .86rem var(--body);color:var(--soft);background:var(--panel);border:0;padding:.35rem .8rem;cursor:pointer}
.lang-switch button[aria-pressed=true]{background:var(--accent);color:#fff}

/* prompt page */
.meta-row{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;align-items:center;color:var(--muted);font-size:.9rem}
.level{font-size:.76rem;font-weight:600;padding:.12rem .55rem;border-radius:4px;background:var(--panel-2);color:var(--soft)}
.level--halado{background:var(--accent);color:#fff}.level--profi{background:var(--hot);color:#fff}
.example-in{display:grid;gap:0;margin:0 0 1rem;max-width:74ch;border-top:1px solid var(--line)}
.example-in div{display:grid;grid-template-columns:minmax(8rem,13rem) 1fr;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--line)}
.example-in dt{font-weight:600;color:var(--mark)}.example-in dd{margin:0;color:var(--soft)}
.example-out{margin:0;border:1px solid var(--line);padding:1.2rem 1.4rem;max-width:80ch}
.example-out figcaption{font-weight:600;margin-bottom:.7rem;color:var(--accent-2)}
.example-out .prose>*:last-child{margin-bottom:0}
.example-out table{border-collapse:collapse;font-size:.92rem;display:block;overflow-x:auto}.example-out th,.example-out td{border:1px solid var(--line-2);padding:.38rem .65rem;text-align:left}
.example-out th{background:var(--panel)}
.example-out code{background:var(--panel);padding:.12em .4em;border-radius:3px;font-size:.9em}
.example-out pre{background:var(--panel);padding:.8rem 1rem;overflow:auto}.example-out pre code{background:none;padding:0}
.example-out blockquote{margin:.6rem 0;padding-left:1rem;border-left:3px solid var(--line-2);color:var(--soft)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:2.2rem;margin-top:2.6rem}
.tips div{margin-bottom:.8rem}.tips dt{font-weight:600;color:var(--text)}.tips dd{margin:0}
.followups{border-top:1px solid var(--line);max-width:74ch}
.followups li{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--line);color:var(--soft)}
.gallery{display:flex;flex-wrap:wrap;gap:1rem}
.gallery figure{margin:0;max-width:14rem}
.gallery img{display:block;width:100%;height:auto}
.gallery figcaption{padding:.4rem 0;font-size:.84rem;color:var(--muted)}

/* workflows */
.steps{list-style:none;padding:0;margin:2rem 0 0;counter-reset:step;max-width:76ch}
.steps>li{counter-increment:step;position:relative;padding:0 0 2.2rem 3.2rem;border-left:2px solid var(--line-2);margin-left:1rem}
.steps>li::before{content:counter(step);position:absolute;left:-1.1rem;top:0;width:2.1rem;height:2.1rem;background:var(--accent);color:#fff;display:grid;place-items:center;font:700 1rem var(--display);clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%)}
.steps>li:last-child{border-left-color:transparent}
.step-phase{margin:0;color:var(--muted);font-weight:500;font-size:.86rem}
.note{display:block}

/* right rail */
.rail{padding:1.3rem 1.3rem 1.3rem 1.4rem;position:sticky;top:0;align-self:start;max-height:calc(100vh - 2*var(--gap));min-height:100%;overflow-y:auto;scrollbar-width:none;border-left:1px solid var(--line)}
.rail section{margin-bottom:1.6rem;padding-bottom:1.4rem;border-bottom:1px solid var(--line)}
.rail h2{font-size:1.05rem;margin-bottom:.8rem}
.rail-list{display:grid;gap:.8rem}
.rail-list a{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:var(--text)}
.rail-list a:hover strong{color:var(--accent-2)}
.rail-list strong{display:block;font-weight:500;font-size:.93rem;line-height:1.3}
.rail-list em{display:block;font-style:normal;color:var(--muted);font-size:.82rem}
.rail-thumb{flex:none;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--panel-2);display:grid;place-items:center;font:700 .82rem var(--display);color:var(--accent-2)}
.rail-thumb .ico{width:17px;height:17px}

/* ads: slots reserve their height so the page does not jump */
.ad-slot{margin:1.4rem 0;padding-inline:clamp(1rem,2.4vw,2rem);min-height:96px}
main .ad-slot,.rail .ad-slot{padding-inline:0}
.cards>.ad-slot{grid-column:1/-1;margin:0}
.ad-slot--prompt_after,.ad-slot--content_bottom,.ad-slot--home_mid{min-height:104px}
.ad-slot--rail{min-height:250px}
.ad-slot.is-empty{display:none}
.ad-label{display:block;font-size:.72rem;font-weight:600;color:var(--muted);margin-bottom:.15rem}
.ad-code{text-align:center;overflow:hidden}
.ad-banner{display:flex;align-items:center;gap:1.1rem;padding:.9rem 1.2rem;color:var(--text);text-decoration:none;min-height:96px;border:1px dashed var(--line-2)}
.ad-banner img{width:72px;height:72px;object-fit:cover;flex:none}
.ad-banner-text{display:grid;flex:1}
.ad-banner-text strong{font:600 1.08rem var(--display)}
.ad-banner-text>span:last-child{color:var(--soft);font-size:.93rem}
.ad-banner-cta{flex:none;font-weight:600;padding:.5rem .95rem;background:#fff;color:var(--ink);--cut:8px;clip-path:var(--cut-shape)}
.ad-banner:hover{background:var(--panel)}
.ad-slot--sidebar_bottom{margin:1rem .9rem 0;padding:0;min-height:150px}
.ad-slot--sidebar_bottom .ad-banner,.ad-slot--rail .ad-banner{flex-direction:column;align-items:stretch;gap:.7rem;padding:1rem;border:0}
.ad-slot--sidebar_bottom .ad-banner{background:var(--accent);--cut:16px;clip-path:var(--cut-shape)}
.ad-slot--sidebar_bottom .ad-label{color:rgba(255,255,255,.8)}
.ad-slot--sidebar_bottom .ad-banner-text>span:last-child{color:#fff;font-size:.88rem}
.ad-slot--sidebar_bottom .ad-banner-cta,.ad-slot--rail .ad-banner-cta{text-align:center}
.ad-slot--rail .ad-banner{background:var(--panel)}

/* footer, consent, toast */
.site-footer{margin-block:.5rem 1.4rem;padding-top:1.1rem;border-top:1px solid var(--line);font-size:.88rem;color:var(--muted)}
.site-footer p{margin:0 0 .6rem}.site-footer strong{color:var(--soft)}
.footer-links{display:flex;flex-wrap:wrap;gap:.3rem 1rem}.footer-links a{color:var(--soft)}
.footer-legal{margin:0!important;font-size:.82rem}
.consent{position:fixed;inset:auto 1rem 1rem 1rem;max-width:42rem;margin-inline:auto;padding:1.1rem 1.3rem;z-index:80;background:var(--panel-2);border:1px solid var(--line-2);border-left:5px solid var(--accent);box-shadow:0 24px 60px -20px #000}
.consent p{margin-bottom:.8rem;font-size:.93rem;color:var(--soft)}
.consent div{display:flex;gap:.6rem;flex-wrap:wrap}
.toast{position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%,150%);opacity:0;pointer-events:none;background:#fff;color:var(--ink);padding:.55rem 1.1rem;font-weight:600;z-index:90;transition:transform .2s,opacity .2s}
.toast.on{transform:translate(-50%,0);opacity:1}
.scrim{position:fixed;inset:0;background:rgba(8,8,12,.65);z-index:40}

@media (max-width:1240px){:root{--gap:14px}.app{grid-template-columns:248px minmax(0,1fr)}.rail{display:none}}
@media (max-width:900px){
  :root{--gap:0px}
  .app{grid-template-columns:minmax(0,1fr);border-radius:0;overflow:visible}
  .sidebar{position:fixed;inset:0 auto 0 0;width:min(290px,86vw);height:100%;z-index:50;background:var(--app);transform:translateX(-102%);transition:transform .2s}
  body.menu-open .sidebar{transform:none}
  .menu-btn{display:grid}
  .topbar{position:sticky;top:0;z-index:30;background:rgba(20,20,23,.96)}
  .feature-bg{inset:-1rem -3rem auto 20%;font-size:1.2rem;opacity:.7}
}
@media (max-width:760px){
  .ptool,.two-col{grid-template-columns:1fr}
  .filters{grid-template-columns:1fr 1fr}.f-search{grid-column:1/-1}
  .ad-banner{flex-wrap:wrap}
  .example-in div{grid-template-columns:1fr;gap:.1rem}
  .feature{--cut:22px}.feature-in{min-height:21rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.toast,.sidebar,.thumb::after{transition:none}}
@media print{.sidebar,.rail,.topbar,.site-footer,.ad-slot,.consent,.ptool-fields,.ptool-actions,.fav{display:none!important}body{background:#fff;color:#000}.app{display:block;background:#fff;box-shadow:none}.sheet,.example-out{background:#fff;color:#000;border:1px solid #999;clip-path:none}}

/* ---- ticker, search results, topic images, small motion ---- */
.pulse{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:#fff;margin-right:.45rem;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}
.ticker{display:flex;align-items:center;gap:.9rem;height:2.5rem;padding:0 clamp(1rem,2.4vw,2rem);border-bottom:1px solid var(--line);font-size:.88rem;overflow:hidden}
.ticker-label{flex:none;display:inline-flex;align-items:center;background:var(--hot);color:#fff;font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;padding:.15rem .55rem;border-radius:4px}
.ticker-items{flex:1;min-width:0}
.ticker-items a{display:flex;gap:.8rem;color:var(--text);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:tick .45s ease-out}
.ticker-items a:hover{color:var(--accent-2)}
.ticker-items time{color:var(--muted)}
.ticker-all{flex:none;font-size:.84rem}
@keyframes tick{from{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:none}}
.top-search{z-index:25}
.search-drop{position:absolute;left:0;right:0;top:calc(100% + .4rem);background:var(--panel);border:1px solid var(--line-2);box-shadow:0 24px 50px -20px #000;display:grid}
.search-drop a{display:flex;justify-content:space-between;gap:1rem;padding:.6rem .9rem;color:var(--text);text-decoration:none;border-bottom:1px solid var(--line)}
.search-drop a:hover{background:var(--panel-2)}
.search-drop strong{font-weight:500}.search-drop em{font-style:normal;color:var(--muted);font-size:.85rem;white-space:nowrap}
.search-drop button{font:500 .88rem var(--body);color:var(--accent-2);background:none;border:0;padding:.6rem .9rem;text-align:left;cursor:pointer}
.search-drop p{margin:0;padding:.7rem .9rem;color:var(--muted);font-size:.9rem}
.topic-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr));gap:1rem}
.topic-grid a{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:var(--panel);text-decoration:none;color:#fff;--cut:16px;clip-path:var(--cut-shape)}
.topic-grid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.topic-grid a:hover img{transform:scale(1.08)}
.topic-grid-text{position:absolute;inset:auto 0 0 0;padding:1.6rem .8rem .7rem;background:linear-gradient(transparent,rgba(10,10,14,.92));display:grid}
.topic-grid strong{font:600 1.02rem var(--display)}
.topic-grid em{font-style:normal;font-size:.8rem;color:var(--soft)}
.topic-grid a::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 0 var(--accent);transition:box-shadow .15s}
.topic-grid a:hover::after{box-shadow:inset 4px -4px 0 var(--accent)}
.topic-head{position:relative;display:flex;gap:2rem;align-items:center;justify-content:space-between;padding:1.6rem clamp(1.1rem,2.5vw,2rem);margin-bottom:1.8rem;overflow:hidden;background:#0F0F12;--cut:26px;clip-path:var(--cut-shape)}
.topic-head::before{content:"";position:absolute;inset:-60px;background:var(--img) right center/55% auto no-repeat;filter:blur(46px) saturate(1.3);opacity:.55}
.topic-head>*{position:relative}
.topic-head h1{font-size:clamp(1.7rem,3vw,2.4rem)}
.topic-head .prose>*:last-child{margin-bottom:0}
.topic-head img{flex:none;width:11rem;height:11rem;object-fit:cover;--cut:20px;clip-path:var(--cut-shape)}
.feature-bg mark{transition:background .2s,color .2s}
.feature-bg mark.typed{background:rgba(139,92,246,.42);color:#fff;font-weight:500}
.feature-bg mark.typing::after{content:"";display:inline-block;width:2px;height:1em;background:#fff;margin-left:2px;vertical-align:-.12em;animation:pulse .7s steps(2) infinite}
.feature-in::before{content:"";position:absolute;width:38rem;height:38rem;right:-12rem;top:-16rem;background:radial-gradient(closest-side,rgba(139,92,246,.38),transparent);animation:drift 14s ease-in-out infinite alternate;pointer-events:none}
@keyframes drift{to{transform:translate(-9rem,7rem)}}
.thumb-text{transition:transform 3.5s linear}
.tile:hover .thumb-text{transform:translateY(-38%)}
.mods{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin-top:.9rem;font-size:.86rem;color:var(--muted)}
.mod{font:500 .84rem var(--body);background:none;border:1px solid var(--line-2);color:var(--soft);padding:.22rem .7rem;border-radius:99px;cursor:pointer}
.mod:hover{border-color:var(--accent-2);color:#fff}
.mod[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff}
.ptool-more{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;align-items:center;margin:.7rem 0 0;font-size:.88rem}
.ptool-more .linklike{display:inline-flex;align-items:center;gap:.4rem;color:var(--accent-2)}
.ptool-more .ico{width:16px;height:16px}
.ptool-fields .f-check{padding:.2rem 0}
@media (max-width:760px){.topic-head img{display:none}.ticker-all{display:none}}
@media (prefers-reduced-motion:reduce){.pulse,.feature-in::before,.ticker-items a{animation:none}.thumb-text,.topic-grid img{transition:none}.tile:hover .thumb-text{transform:none}}

/* ---- logo ---- */
.brand{gap:.6rem}
.logo-mark{flex:none;display:block;overflow:visible;filter:drop-shadow(0 2px 5px rgba(139,92,246,.22))}
.logo-text{display:grid;gap:.34rem;flex:none}
.logo-word{display:block;color:#fff;overflow:visible}
.logo-tag{font:600 .53rem/1 var(--display);letter-spacing:.3em;text-transform:uppercase;color:var(--muted,#8f8fa3);white-space:nowrap}
.logo-caret{animation:logo-blink 1.1s steps(1) infinite}
.logo-star{transform-box:fill-box;transform-origin:center;animation:logo-twinkle 3.2s ease-in-out infinite}
.logo-star--2{animation-delay:-1.6s}
@keyframes logo-blink{50%{opacity:0}}
@keyframes logo-twinkle{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(.72) rotate(18deg)}}
.logo-d{stroke-dasharray:1;animation:logo-draw .9s cubic-bezier(.4,0,.2,1) both;animation-delay:calc(var(--i)*.15s + .1s)}
.brand:hover .logo-d{animation-name:logo-redraw}
@keyframes logo-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes logo-redraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.logo-caret,.logo-star,.logo-d,.brand:hover .logo-d{animation:none}}
/* ---- sample images: shown sharp at their own size, on a blurred copy of themselves ---- */
.thumb--img{background-image:none}
.thumb--img::before,.gallery-frame::before{content:"";position:absolute;inset:-24px;background:var(--img) center/cover no-repeat;filter:blur(22px) brightness(.5) saturate(1.25)}
.thumb--img img{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);width:auto;height:auto;max-width:62%;max-height:70%;box-shadow:0 10px 30px -8px #000,0 0 0 2px rgba(255,255,255,.16);transition:transform .25s ease}
.tile:hover .thumb--img img{transform:translate(-50%,-50%) scale(1.06)}
.gallery figure{max-width:none}
.gallery-frame{position:relative;width:19rem;max-width:100%;aspect-ratio:16/11;overflow:hidden;background:var(--panel);display:grid;place-items:center;--cut:18px;clip-path:var(--cut-shape)}
.gallery-frame img{position:relative;width:auto;height:auto;max-width:72%;max-height:80%;box-shadow:0 12px 34px -8px #000,0 0 0 2px rgba(255,255,255,.16)}
@media (prefers-reduced-motion:reduce){.thumb--img img{transition:none}}
.example-in dd{white-space:pre-wrap;overflow-wrap:anywhere}
/* ---- full-bleed shell: no outer frame, roomier header row ---- */
:root{--gap:0px;--bar:5.25rem}
body{background:var(--app)}
.app{border-radius:0;box-shadow:none;margin-block:0;border-inline:1px solid var(--line)}
.brand,.topbar{height:var(--bar);flex:none}
.brand{padding:0 1.5rem;gap:.75rem}
@media (max-width:900px){:root{--bar:4.25rem}.app{border-inline:0}}

/* ---- guides ---- */
.guide h2{font:700 1.45rem/1.25 var(--display);margin:2.2rem 0 .7rem}
.guide h3{font:600 1.1rem/1.3 var(--display);color:var(--text);margin:1.5rem 0 .4rem}
.guide p,.guide li{font-size:1.02rem;line-height:1.7}
.guide ul,.guide ol{padding-left:1.3rem;display:grid;gap:.35rem}
.guide a{color:var(--accent-2)}
.guide blockquote{margin:1.2rem 0;padding:.9rem 1.1rem;border-left:3px solid var(--accent);background:var(--panel);color:var(--text)}
.guide blockquote p{margin:0}
.guide table{border-collapse:collapse;width:100%;margin:1rem 0;font-size:.95rem}
.guide th,.guide td{text-align:left;padding:.55rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
.guide th{color:var(--text)}
.prose table{border-collapse:collapse;width:100%;margin:1rem 0;font-size:.95rem}
.prose th,.prose td{text-align:left;padding:.55rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{color:var(--text)}
/* ---- topic tiles: picture beside the text, nothing overlaps; 12 topics fill 4 x 3 evenly ---- */
.topic-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.topic-grid a{aspect-ratio:auto;display:grid;grid-template-columns:4.6rem minmax(0,1fr);align-items:center;gap:.9rem;padding:.55rem .9rem .55rem .55rem;border:1px solid var(--line);--cut:14px;transition:border-color .15s,background .15s}
.topic-grid a:hover{background:var(--panel-2);border-color:var(--line-2)}
.topic-grid img{position:static;width:4.6rem;height:4.6rem;object-fit:cover;--cut:10px;clip-path:var(--cut-shape)}
.topic-grid a:hover img{transform:scale(1.06)}
.topic-grid-text{position:static;padding:0;background:none;gap:.15rem;min-width:0}
.topic-grid strong{font:600 1.05rem/1.25 var(--display)}
.topic-grid em{font-size:.82rem;line-height:1.35;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topic-grid a:hover::after{box-shadow:inset 3px 0 0 var(--accent)}
@media (max-width:1000px){.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.topic-grid{grid-template-columns:1fr}}

/* ---- top bar actions: random prompt, share, saved ---- */
.top-actions{margin-left:auto;display:flex;gap:.5rem;flex:none}
.top-actions .icon-btn{margin-left:0}
.icon-btn:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}
.icon-btn[data-random]:hover .ico{animation:dice-roll .5s ease}
@keyframes dice-roll{50%{transform:rotate(180deg) scale(.85)}100%{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.icon-btn[data-random]:hover .ico{animation:none}}
@media (max-width:420px){.top-actions [data-share-page]{display:none}}
/* ---- sidebar: violet accents ---- */
.sidebar h2{color:var(--accent-2)}
.sidebar nav>.side-nav:first-of-type .ico{color:var(--accent-2)}
.side-nav .ico{transition:color .15s,transform .15s}
.side-nav a:hover,.side-nav .linklike:hover{background:rgba(139,92,246,.1)}
.side-nav a:hover .ico,.side-nav .linklike:hover .ico{color:var(--accent-2);transform:translateX(2px)}
.side-nav a[aria-current]{background:linear-gradient(90deg,rgba(139,92,246,.34),rgba(139,92,246,.07) 75%);box-shadow:inset 3px 0 0 var(--accent)}
.side-nav a[aria-current] .ico{color:#fff}
.side-nav .badge:not(.badge--hot){background:rgba(139,92,246,.2);color:#D6C8FF}
@media (prefers-reduced-motion:reduce){.side-nav .ico{transition:none}.side-nav a:hover .ico{transform:none}}

/* ---- glossary ---- */
.glossary-index{display:flex;flex-wrap:wrap;gap:.4rem;margin:1.2rem 0 1.6rem}
.glossary-index a{font-size:.85rem;padding:.25rem .6rem;border:1px solid var(--line);color:var(--soft);text-decoration:none}
.glossary-index a:hover{border-color:var(--accent);color:#fff}
.glossary{max-width:54rem}
.glossary>div{padding:1.1rem 0;border-top:1px solid var(--line);scroll-margin-top:1rem}
.glossary dt{font:700 1.2rem/1.3 var(--display);color:var(--text)}
.glossary dt span{font:500 .85rem var(--body);color:var(--muted)}
.glossary dd{margin:.35rem 0 0}
.glossary dd p{margin:.4rem 0}
.glossary>div:target{box-shadow:inset 3px 0 0 var(--accent);padding-left:1rem}

.sheet .filled--ref{display:block;border-left:3px solid var(--accent);padding:.1rem 0 .1rem .8rem;background:none;box-shadow:none;color:var(--accent-2)}

/* ---- "based on an attached image" choice, at the top of the fields panel ---- */
.ref-box{margin:0 0 1.1rem;padding:.8rem .85rem .85rem;border:1px dashed var(--line-2);background:rgba(139,92,246,.06)}
.ref-box.is-on{border-style:solid;border-color:var(--accent);background:rgba(139,92,246,.13)}
.ref-title{display:flex;align-items:center;gap:.5rem;font:600 .95rem var(--display);color:var(--text)}
.ref-title em{font:500 .72rem var(--body);font-style:normal;color:var(--accent-2);border:1px solid rgba(167,139,250,.5);padding:.05rem .4rem}
.ref-help{margin:.3rem 0 .6rem;font-size:.82rem;line-height:1.4;color:var(--muted)}
.ref-opts{display:flex;flex-wrap:wrap;gap:.4rem}

/* ---- image settings (ratio, resolution, format) under the fields ---- */
.img-box{margin:1.1rem 0 .4rem;padding:.8rem .85rem .7rem;border:1px solid var(--line-2);background:rgba(255,255,255,.02)}
.img-opts{display:grid;gap:.6rem;margin:.6rem 0 .5rem}
.img-opt{display:grid;gap:.25rem;font-size:.85rem;color:var(--soft)}
.img-opt select{width:100%;padding:.5rem .6rem;background:var(--panel);color:var(--text);border:1px solid var(--line-2);font:500 .92rem var(--body);border-radius:0;appearance:auto}
.img-opt select:focus-visible{outline:2px solid var(--accent-2);outline-offset:1px}

.news-filter{margin:0 0 1.5rem}.news-filter a[aria-current]{background:var(--accent);color:#fff}
.avail{max-width:54rem;margin:1rem 0 0;padding:.8rem 1rem;background:var(--panel);border-left:3px solid var(--mark);color:var(--soft);font-size:.95rem}.avail strong{color:#fff;margin-right:.35rem}
.news-about{max-width:54rem}.lead-prose{max-width:54rem;color:var(--soft)}

.how{display:grid;grid-template-columns:minmax(0,1fr);gap:0;margin:1.75rem 0 .5rem;background:var(--panel);--cut:14px;clip-path:var(--cut-shape)}
.how-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--line)}
.how-steps li{display:flex;align-items:center;gap:.8rem;padding:.9rem 1.1rem;color:var(--muted);position:relative;transition:color .3s,background .3s}
.how-steps li+li{border-left:1px solid var(--line)}
.how-steps li::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.how-steps b{flex:none;width:1.9rem;height:1.9rem;display:grid;place-items:center;font:700 .95rem var(--display);color:var(--accent-2);border:1px solid rgba(167,139,250,.45);transition:background .3s,color .3s,border-color .3s}
.how-steps strong{display:block;font:600 1rem/1.25 var(--display);color:var(--soft);transition:color .3s}
.how-steps em{display:block;font-style:normal;font-size:.82rem;line-height:1.3}
.how-steps li.is-on{color:var(--soft);background:rgba(139,92,246,.08)}
.how-steps li.is-on strong{color:#fff}
.how-steps li.is-on b{background:var(--accent);border-color:var(--accent);color:#fff}
.how-steps li.is-on::after{transform:scaleX(1);transition:transform var(--how-ms,2s) linear}
.how-demo{display:flex;align-items:center;gap:.9rem;padding:1rem 1.1rem;min-height:4.6rem}
.how-topic{flex:none;font:600 .78rem var(--display);color:var(--accent-2);padding:.2rem .6rem;border:1px solid rgba(167,139,250,.4);white-space:nowrap}
.how-line{margin:0;flex:1;min-width:0;font-size:1.02rem;line-height:1.55;color:var(--soft)}
.how-line mark{background:var(--mark);color:var(--ink);padding:.04em .32em;border-radius:3px;font-weight:700;white-space:pre-wrap}
.how-line mark.is-typed{background:rgba(139,92,246,.22);color:#fff;font-weight:600}
.how-line mark.is-typing::after{content:"";display:inline-block;width:2px;height:1em;margin-left:1px;vertical-align:-.12em;background:currentColor;animation:how-caret .8s steps(1) infinite}
.how-copied{flex:none;font:700 .8rem var(--display);padding:.3rem .7rem;background:var(--accent);color:#fff;opacity:0;transform:translateY(4px);transition:opacity .25s,transform .25s}
.how-copied.is-on{opacity:1;transform:none}
.how-demo.is-out .how-line,.how-demo.is-out .how-topic{opacity:0;transition:opacity .3s}
.how-demo .how-line,.how-demo .how-topic{transition:opacity .3s}
@keyframes how-caret{50%{opacity:0}}
@media (max-width:46rem){.how-steps em{display:none}.how-steps li{padding:.7rem .6rem;gap:.5rem}.how-steps strong{font-size:.86rem}.how-steps b{width:1.5rem;height:1.5rem;font-size:.8rem}.how-demo{flex-wrap:wrap;gap:.5rem;min-height:7.2rem;align-items:flex-start}.how-line{flex-basis:100%;font-size:.95rem}}
@media (prefers-reduced-motion:reduce){.how-steps li::after,.how-line mark.is-typing::after{animation:none;transition:none}.how-copied{display:none}}

.flow-how{list-style:none;margin:1.5rem 0 1.75rem;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--panel);--cut:14px;clip-path:var(--cut-shape)}
.flow-how li{display:flex;align-items:center;gap:.8rem;padding:.9rem 1.1rem}.flow-how li+li{border-left:1px solid var(--line)}
.flow-how b{flex:none;width:1.9rem;height:1.9rem;display:grid;place-items:center;font:700 .95rem var(--display);color:#fff;background:var(--accent)}
.flow-how strong{display:block;font:600 1rem/1.25 var(--display);color:#fff}.flow-how em{display:block;font-style:normal;font-size:.82rem;line-height:1.3;color:var(--muted)}
.flow-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:1rem}
.flow-cards--3{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr))}
.flow-cards a{display:flex;flex-direction:column;gap:.55rem;height:100%;padding:1.1rem 1.2rem 1.15rem;background:var(--panel);color:var(--muted);text-decoration:none;--cut:14px;clip-path:var(--cut-shape);border-left:3px solid transparent;transition:background .15s,border-color .15s}
.flow-cards a:hover{background:var(--panel-2);border-left-color:var(--accent)}
.flow-card-top{display:flex;align-items:center;gap:.6rem;font-size:.82rem}
.flow-ico{flex:none;width:2rem;height:2rem;display:grid;place-items:center;color:var(--accent-2);background:rgba(139,92,246,.14)}.flow-ico .ico{width:18px;height:18px}
.flow-topic{font-weight:600;color:var(--accent-2)}.flow-time{margin-left:auto;color:var(--muted);white-space:nowrap}
.flow-cards strong{font:600 1.15rem/1.3 var(--display);color:#fff}
.flow-sum{font-size:.92rem;line-height:1.5}
.flow-chain{display:flex;flex-wrap:wrap;gap:.3rem .1rem;margin-top:auto;padding-top:.5rem;font-size:.78rem}
.flow-chain i{font-style:normal;color:var(--soft);display:inline-flex;align-items:center}
.flow-chain i+i::before{content:"";width:.9rem;height:1px;background:var(--accent);margin:0 .35rem;opacity:.7}
.flow-about{max-width:54rem}
.flow-eyebrow{display:flex;align-items:center;gap:.6rem;margin:0 0 .4rem;font-weight:600;font-size:.9rem;color:var(--accent-2)}
.flow-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1px;margin:1.25rem 0 0;max-width:76ch;background:var(--line)}
.flow-facts div{background:var(--panel);padding:.9rem 1.1rem}.flow-facts dt{font:600 .82rem var(--display);color:var(--mark);margin-bottom:.25rem}.flow-facts dd{margin:0;color:var(--soft);font-size:.95rem;line-height:1.5}
.flow-rail{display:flex;flex-wrap:wrap;gap:.4rem;margin:1.25rem 0 1rem;max-width:76ch;position:sticky;top:var(--bar,5.25rem);z-index:3;padding:.5rem 0;background:var(--app)}
.flow-rail a{display:inline-flex;align-items:center;gap:.45rem;padding:.3rem .7rem .3rem .3rem;font-size:.84rem;font-weight:500;color:var(--soft);text-decoration:none;background:var(--panel)}
.flow-rail a:hover{background:var(--panel-2);color:#fff}
.flow-rail b{width:1.4rem;height:1.4rem;display:grid;place-items:center;font:700 .75rem var(--display);color:var(--accent-2);border:1px solid rgba(167,139,250,.45)}
.flow-rail a.is-done{color:var(--muted)}.flow-rail a.is-done b{background:var(--accent);border-color:var(--accent);color:#fff}
.steps>li{scroll-margin-top:9rem}
.steps>li.is-done::before{background:var(--panel-2);color:var(--accent-2);box-shadow:inset 0 0 0 2px var(--accent)}
.steps>li.is-done .sheet{opacity:.6}
.step-actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.step-done{display:inline-flex;align-items:center;gap:.45rem;font-size:.9rem;color:var(--soft);cursor:pointer}.step-done input{width:1.05rem;height:1.05rem;accent-color:var(--accent)}
.section-note{margin:-.4rem 0 1rem;color:var(--muted);font-size:.92rem;max-width:60ch}
@media (max-width:46rem){.flow-how{grid-template-columns:1fr}.flow-how li+li{border-left:0;border-top:1px solid var(--line)}.flow-rail{position:static}}

.prose code,.example-out code,.feature-list code,.sheet code{overflow-wrap:anywhere;word-break:break-word}
.prose pre,.example-out pre{max-width:100%;overflow-x:auto}
.consent a{color:var(--accent-2)}
@media (pointer:coarse){.fav{min-height:36px;padding:.35rem .8rem}.pill-list a,.flow-rail a{min-height:36px}}

.footer-cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:1.2rem 2rem;margin:1rem 0 1.1rem}
.footer-col h2{margin:0 0 .5rem;font:600 .82rem var(--display);color:var(--accent-2)}
.footer-col ul{list-style:none;margin:0;padding:0;display:grid;gap:.3rem}
.footer-col--wide ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.2rem}
.footer-col a{color:var(--soft);text-decoration:none}.footer-col a:hover{color:#fff;text-decoration:underline}
@media (max-width:60rem){.footer-cols{grid-template-columns:1fr 1fr}.footer-col--wide{grid-column:1/-1}}
@media (pointer:coarse){.footer-col ul{gap:.55rem}}

.footer-legal{max-width:70ch;line-height:1.5}.footer-legal a{color:var(--soft)}

/* Region tones: the side columns sit a step darker than the reading area, so the three parts read as separate surfaces. */
:root{--side:#0F0F13}
.sidebar{background:linear-gradient(180deg,#17122B 0,var(--side) 22rem)}
.rail{background:var(--side)}
.sidebar .brand,.sidebar>a:first-child{background:transparent}

.feature{position:relative}
.feature-in[hidden]{display:none}
.feature-in:not([hidden]){animation:feature-in .45s ease both}
@keyframes feature-in{from{opacity:0}to{opacity:1}}
.feature-nav{position:absolute;right:1.4rem;bottom:1.7rem;z-index:2;display:flex;align-items:center;gap:.5rem}
.feature-nav>button{width:2.2rem;height:2.2rem;display:grid;place-items:center;font:600 1.3rem/1 var(--display);color:#fff;background:rgba(255,255,255,.1);border:0;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.feature-nav>button:hover{background:var(--accent)}
.feature-dots{display:flex;align-items:center;gap:.1rem}
.feature-dots button{width:1.4rem;height:1.6rem;padding:0;border:0;background:none;cursor:pointer;display:grid;place-items:center}
.feature-dots button::before{content:"";width:.5rem;height:.5rem;background:rgba(255,255,255,.35);transition:width .2s,background .2s}
.feature-dots button[aria-current]::before{width:1.1rem;background:var(--mark)}
.feature-dots button:hover::before{background:#fff}
@media (max-width:46rem){.feature-nav{right:.8rem;bottom:1rem}.feature-nav>button{display:none}.feature-actions{padding-bottom:1.6rem}}
@media (prefers-reduced-motion:reduce){.feature-in:not([hidden]){animation:none}}

/* Card hover: a frame that follows the cut corners, so the accent line is never severed by the clipped corner. */
.thumb::after{box-shadow:none;background:var(--accent);opacity:0;transition:opacity .15s;z-index:2;pointer-events:none;
  clip-path:polygon(evenodd,0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%,0 0,3px 3px,3px calc(100% - 3px),calc(100% - 3px) calc(100% - 3px),calc(100% - 3px) 17.24px,calc(100% - 17.24px) 3px,3px 3px)}
.tile:hover .thumb::after,.thumb:focus-visible::after{box-shadow:none;opacity:1}

/* Home: brand statement above the featured prompts */
.pitch{padding:.2rem 0 1.5rem}
.pitch h1{font-size:clamp(1.3rem,2.1vw,1.75rem);font-weight:700;line-height:1.3;letter-spacing:0;max-width:none;margin:0 0 .6rem}
.pitch-rot{display:block;min-height:1.45em;margin:.1em 0}
.pitch-rot>span{display:inline-block;background:var(--mark);color:var(--ink);padding:0 .35em;font-weight:800;--cut:7px;clip-path:var(--cut-shape)}
.pitch-rot>span.is-typing::after{content:"";display:inline-block;width:2px;height:.95em;background:var(--ink);margin-left:3px;vertical-align:-.1em;animation:pulse .7s steps(2) infinite}
.pitch-lead{font-size:.98rem;line-height:1.55;color:#D9D9E2;max-width:52ch;margin:0 0 1rem}
.pitch-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:0}
.pitch-why{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:.6rem}
.pitch-why li{position:relative;background:var(--panel);padding:.75rem .9rem .8rem;border-left:3px solid var(--accent);animation:pitch-in .45s ease both}
.pitch-why li:nth-child(2){animation-delay:.07s}.pitch-why li:nth-child(3){animation-delay:.14s}.pitch-why li:nth-child(4){animation-delay:.21s}
.pitch-fig{display:block;font:800 1.45rem/1.1 var(--display);color:var(--accent-2);margin-bottom:.2rem;font-variant-numeric:tabular-nums}
.pitch-why li>span{display:block;font-size:.84rem;line-height:1.4;color:var(--soft)}
@keyframes pitch-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.section-head--tight{margin-top:0}
.feature-in{min-height:21rem}
.feature h3{font-size:clamp(1.8rem,3.8vw,2.8rem);margin-top:1.6rem}
@media (max-width:1100px){.pitch{grid-template-columns:1fr;gap:1.1rem}.pitch-why{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pitch-actions .btn{flex:1 1 100%;justify-content:center}.pitch-fig{font-size:1.25rem}}
@media (prefers-reduced-motion:reduce){.pitch-why li{animation:none}.pitch-rot>span.is-typing::after{display:none}}

/* Prompt tool: sharing the filled-in version is a deliberate, second step */
.share-filled{margin:.5rem 0 0;font-size:.9rem}
.share-filled summary{cursor:pointer;color:var(--soft);width:fit-content;padding:.35rem 0}
.share-filled summary:hover{color:#fff}
.share-filled[open]{background:var(--panel-2);border-left:3px solid var(--mark);padding:.5rem .9rem .9rem;margin-top:.7rem}
.share-filled p{margin:.3rem 0 .8rem;color:#E4E4EA;line-height:1.5;max-width:56ch}

/* Prompt page: what the sample answer is and is not */
.example-note{font-size:.86rem;line-height:1.5;color:var(--muted);margin:.7rem 0 0;max-width:70ch}
.example-note a{color:var(--accent-2)}
.tested{color:#9BE7B0}

/* Prompt checker */
.checker textarea{min-height:16rem;font-size:.98rem;line-height:1.55}
.check-sum{margin:0 0 .9rem;padding:.75rem 1rem;background:var(--panel);border-left:3px solid var(--line-2);color:var(--soft);font-weight:600}
.check-sum--err{border-left-color:#FF6B6B;color:#fff}.check-sum--warn{border-left-color:var(--mark);color:#fff}.check-sum--ok{border-left-color:#5BD88A;color:#fff}
.check-list{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.5rem}
.check{background:var(--panel);padding:.7rem .9rem;border-left:3px solid var(--line-2)}
.check strong{display:inline;color:#fff;font:600 .98rem var(--display)}
.check p{margin:.3rem 0 0;font-size:.9rem;line-height:1.5;color:var(--soft)}
.check-tag{display:inline-block;font-size:.74rem;font-weight:700;padding:.08rem .5rem;margin-right:.55rem;border-radius:3px;background:var(--panel-2);color:var(--soft);vertical-align:.08em}
.check--err{border-left-color:#FF6B6B}.check--err .check-tag{background:#FF6B6B;color:#1a0b0b}
.check--warn{border-left-color:var(--mark)}.check--warn .check-tag{background:var(--mark);color:var(--ink)}
.check--tip{border-left-color:var(--accent-2)}.check--tip .check-tag{background:var(--accent);color:#fff}
.check--ok{padding:.45rem .9rem;border-left-color:#5BD88A;opacity:.85}.check--ok .check-tag{background:transparent;color:#5BD88A;padding-left:0}
.check--ok strong{font-weight:500;color:var(--soft)}
.check-marked{white-space:pre-wrap;font-size:.92rem;line-height:1.7}
.hit{padding:0 .2em;border-radius:2px;color:var(--ink)}
.hit--err{background:#FF8A8A}.hit--clash{background:#FFB36B}.hit--sens{background:var(--mark)}.hit--vague{background:#C9B8FF}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Home pitch: flat and typographic. The visual is the product's own motif, fill-in fields you can click. */
.pitch{padding:0;margin:0 0 1.9rem}
.pitch-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:2rem;align-items:center;padding:.6rem 0 1.6rem}
.pitch h1{font-size:clamp(2rem,3.6vw,3.1rem);font-weight:800;line-height:1.05;letter-spacing:-.01em;margin:0 0 .8rem;max-width:12ch}
.pitch-lead{font-size:1.02rem;line-height:1.6;color:#D9D9E2;max-width:44ch;margin:0 0 1.2rem}
.pitch-asks{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem .55rem;align-items:center}
.pitch-asks a{display:block;font:700 1.2rem/1.25 var(--display);padding:.22em .5em;text-decoration:none;background:var(--mark);color:var(--ink);border-radius:4px;transition:transform .12s,background .12s}
.pitch-asks li:nth-child(3n+2) a{background:rgba(139,92,246,.3);color:#fff}
.pitch-asks li:nth-child(3n) a{background:var(--panel-2);color:#fff}
.pitch-asks a:hover,.pitch-asks a:focus-visible{transform:translateY(-2px);background:#fff;color:var(--ink)}
.how--in{margin:0}
@media (max-width:1100px){.pitch-top{grid-template-columns:1fr;gap:1.2rem}.pitch h1{max-width:none}}
@media (max-width:560px){.pitch-asks a{font-size:1.02rem}.pitch-actions .btn{flex:1 1 100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.pitch-asks a{transition:none}}
.nw{white-space:nowrap}

/* Home: a slim "prompt of the day" row and audience shortcuts instead of the large featured block */
.today{margin:0 0 .4rem;display:grid;gap:.9rem}
.today-card{display:flex;align-items:center;gap:1rem;padding:.8rem 1rem;background:var(--panel);border-left:3px solid var(--mark);text-decoration:none;color:var(--text)}
.today-card:hover{background:var(--panel-2)}
.today-tag{flex:none;font:700 .78rem var(--display);color:var(--ink);background:var(--mark);padding:.2rem .55rem;border-radius:3px}
.today-main{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:.1rem .8rem}
.today-main strong{font:700 1.12rem/1.3 var(--display);color:#fff}
.today-main em{font-style:normal;font-size:.88rem;color:var(--muted)}
.today-go{flex:none;display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.94rem;color:var(--accent-2)}
.today-go .ico{width:16px;height:16px}
.today-who{display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap}
.today-who>span{flex:none;font:600 .95rem var(--display);color:var(--soft)}
.today-who ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.today-who a{display:block;font-size:.88rem;padding:.3rem .7rem;border:1px solid var(--line-2);border-radius:99px;color:var(--soft);text-decoration:none}
.today-who a:hover{border-color:var(--accent-2);color:#fff}
@media (max-width:560px){.today-card{flex-wrap:wrap;gap:.5rem .8rem}.today-main{flex-basis:100%;order:2}.today-go{order:3}.today-who a{padding:.45rem .8rem}}

/* Home: clear rhythm between blocks, each section starts with a rule */
.pitch{margin-bottom:2.4rem}
.pitch-top{padding-bottom:2rem}
.today{margin:0}
.section--ruled{margin-top:2.6rem;padding-top:1.9rem;border-top:1px solid var(--line)}
.section--ruled .section-head{margin-top:0}
.who-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.who-list a{display:block;font-size:.92rem;padding:.4rem .85rem;background:var(--panel);border:1px solid var(--line);border-radius:99px;color:var(--soft);text-decoration:none}
.who-list a:hover{border-color:var(--accent-2);color:#fff}
@media (max-width:560px){.who-list a{padding:.5rem .85rem}.section--ruled{margin-top:2rem;padding-top:1.5rem}}
.section--ruled{position:relative;border-top:1px solid rgba(255,255,255,.13);margin-top:2.8rem;padding-top:2rem}
.section--ruled::before{content:"";position:absolute;left:0;top:-1px;width:56px;height:3px;background:var(--accent)}
.pitch{margin-bottom:1.4rem}
.how--in{margin-bottom:0}

/* Ad slots: house banners look finished, and every slot keeps its reserved height for later third-party ads */
.ad-banner{border:0;background:var(--panel);border-left:3px solid var(--accent);padding:.9rem 1.2rem}
.ad-banner:hover{background:var(--panel-2)}
.ad-banner-text strong{color:#fff}
.ad-banner-cta{white-space:nowrap}
.ad-slot--rail .ad-banner{border-left:0;border-top:3px solid var(--accent);min-height:250px;justify-content:center}
.ad-slot--rail .ad-banner-text strong{font-size:1.2rem;line-height:1.25;margin:.2rem 0 .4rem}
.ad-slot--rail .ad-banner-cta,.ad-slot--sidebar_bottom .ad-banner-cta{align-self:flex-start}
.ad-slot--sidebar_bottom .ad-banner{border-left:0}
.ad-slot--header_below,.ad-slot--footer_above{min-height:90px}
@media (max-width:560px){.ad-banner{flex-wrap:wrap;gap:.6rem}.ad-banner-cta{margin-left:0}}
.topic-head img{width:9rem;height:9rem;--cut:16px}

/* Home hero: big question on the left, highlighted tasks on the right. Whole sets cross-fade in a box whose
   height is that of the tallest set, so nothing on the page ever moves. */
.pitch-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:2rem;align-items:center;padding:.9rem 0 2rem}
.pitch h1{font-size:clamp(2.1rem,3.8vw,3.3rem);font-weight:800;line-height:1.05;letter-spacing:-.01em;margin:0 0 .8rem;max-width:12ch}
.pitch-lead{font-size:1.02rem;line-height:1.6;color:#D9D9E2;max-width:44ch;margin:0 0 1.2rem}
.pitch-sets{display:grid}
.pitch-asks{grid-area:1/1;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem .55rem;align-content:flex-start;align-items:center;transition:opacity .45s ease,transform .45s ease}
.pitch-asks.is-off{opacity:0;visibility:hidden;transform:translateY(6px);pointer-events:none;transition:opacity .45s ease,transform .45s ease,visibility 0s .45s}
.pitch-asks li{height:auto;min-width:0}
.pitch-asks a{display:block;max-width:none;overflow:visible;white-space:nowrap;font:700 1.2rem/1.25 var(--display);padding:.22em .5em;text-decoration:none;background:var(--mark);color:var(--ink);border-radius:4px;transition:transform .12s,background .12s}
.pitch-asks li:nth-child(3n+2) a{background:rgba(139,92,246,.3);color:#fff}
.pitch-asks li:nth-child(3n) a{background:var(--panel-2);color:#fff}
.pitch-asks a:hover,.pitch-asks a:focus-visible{transform:translateY(-2px);background:#fff;color:var(--ink)}
.pitch-more{display:flex;align-items:center;gap:.9rem;margin:1rem 0 0;font-size:.95rem}
.pitch-more a{color:var(--accent-2);font-weight:600}
.pitch-dots{display:inline-flex;gap:.35rem}
.pitch-dots i{width:1.4rem;height:4px;background:var(--line-2);transition:background .3s}
.pitch-dots i.is-on{background:var(--mark)}
@media (max-width:1100px){.pitch-top{grid-template-columns:1fr;gap:1.3rem}.pitch h1{max-width:none}}
@media (max-width:560px){.pitch-asks a{font-size:1.02rem}.pitch-actions .btn{flex:1 1 100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.pitch-asks{transition:none}}
.pitch-top{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:start}
.pitch-more{margin:.35rem 0 .8rem;justify-content:space-between}
.pitch-asks a{font-size:1.08rem}
.pitch-asks{gap:.5rem .5rem}
@media (max-width:1100px){.pitch-top{grid-template-columns:1fr}}
@media (max-width:560px){.pitch-asks a{font-size:.98rem}}

/* Image gallery: dense masonry wall. The picture opens enlarged; the slim bar under it leads to the prompt. */
.gal-filter{display:flex;flex-wrap:wrap;gap:.45rem;margin:0 0 1.2rem}
.gal{columns:4 11.5rem;column-gap:.7rem}
.gal-item{break-inside:avoid;margin:0 0 .7rem;background:var(--panel);border-bottom:2px solid transparent;transition:border-color .15s}
.gal-item:hover{border-bottom-color:var(--accent)}
.gal-item[hidden]{display:none}
.gal-img{position:relative;display:block;overflow:hidden;cursor:zoom-in}
.gal-img img{display:block;width:100%;height:auto;transition:transform .35s ease}
.gal-item:hover .gal-img img{transform:scale(1.04)}
.gal-tool{position:absolute;left:.45rem;top:.45rem;font:600 .7rem/1 var(--display);padding:.28rem .45rem;background:rgba(15,15,19,.82);color:#fff;border-radius:3px}
.gal-item figcaption{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.4rem .4rem .4rem .6rem}
.gal-title{min-width:0;flex:1;color:var(--soft);font:600 .82rem/1.25 var(--display);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gal-title:hover{color:#fff;text-decoration:underline}
.gal-acts{flex:none;display:flex;gap:.1rem}
.gal-acts a{display:grid;place-items:center;width:1.9rem;height:1.9rem;color:var(--muted);border-radius:3px}
.gal-acts a:hover{color:#fff;background:var(--panel-2)}
.gal-acts .ico{width:16px;height:16px}
.lightbox{border:0;padding:0;background:transparent;max-width:min(96vw,1100px);max-height:96vh;width:fit-content;color:var(--text);overflow:visible}
.lightbox::backdrop{background:rgba(8,8,11,.9)}
.lightbox figure{margin:0;background:var(--panel);border-bottom:3px solid var(--accent)}
.lightbox img{display:block;max-width:min(96vw,1100px);max-height:calc(96vh - 5.5rem);width:auto;height:auto;margin:0 auto;background:#0F0F12}
.lightbox figcaption{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:.8rem 1rem}
.lightbox figcaption strong{display:block;font:700 1.05rem/1.25 var(--display);color:#fff}
.lightbox figcaption em{font-style:normal;font-size:.85rem;color:var(--muted)}
.lightbox-x,.lightbox-nav{position:fixed;display:grid;place-items:center;width:2.8rem;height:2.8rem;font:600 1.6rem/1 var(--display);color:#fff;background:rgba(255,255,255,.1);border:0;cursor:pointer;z-index:2}
.lightbox-x:hover,.lightbox-nav:hover{background:var(--accent)}
.lightbox-x{top:1rem;right:1rem}
.lightbox-nav{top:50%;transform:translateY(-50%)}
.lightbox-prev{left:1rem}.lightbox-next{right:1rem}
@media (max-width:760px){.gal{columns:2;column-gap:.5rem}.gal-item{margin-bottom:.5rem}.gal-acts a{width:2.4rem;height:2.4rem}.lightbox-nav{top:auto;bottom:1rem;transform:none}.lightbox-x{top:.5rem;right:.5rem}.lightbox img{max-height:calc(96vh - 9rem)}}
@media (prefers-reduced-motion:reduce){.gal-img img{transition:none}.gal-item:hover .gal-img img{transform:none}}

/* Mobile: the menu button is the way to everything, so it is the loudest thing in the top bar */
.menu-btn-label{display:none}
@media (max-width:900px){
  .menu-btn{display:inline-flex;align-items:center;gap:.45rem;width:auto;padding:0 .85rem 0 .7rem;background:var(--accent);color:#fff;font:700 .95rem var(--display);border-radius:6px}
  .menu-btn .ico{width:20px;height:20px}
  .menu-btn-label{display:inline}
  .menu-btn.is-new{animation:menu-nudge 2.6s ease-in-out 1.2s 3}
  .menu-btn.is-new::after{content:"";position:absolute;right:.3rem;top:.3rem;width:.5rem;height:.5rem;border-radius:50%;background:var(--mark)}
}
@keyframes menu-nudge{0%,60%,100%{background:var(--accent)}20%,40%{background:var(--mark);color:var(--ink)}}
@media (prefers-reduced-motion:reduce){.menu-btn.is-new{animation:none}}

/* Seasonal: a small tree with twinkling lights beside the "Ünnepek" menu item */
.side-nav a.is-xmas .ico{color:var(--mark)}
.xmas-tree{margin-left:.1rem;flex:none;overflow:visible}
.xmas-light{animation:xmas-twinkle 1.8s ease-in-out infinite}
.xmas-light:nth-of-type(2){animation-delay:.45s}.xmas-light:nth-of-type(3){animation-delay:.9s}.xmas-light:nth-of-type(4){animation-delay:1.35s}
.xmas-star{transform-box:fill-box;transform-origin:center;animation:xmas-star 2.6s ease-in-out infinite}
@keyframes xmas-twinkle{0%,100%{opacity:1}50%{opacity:.2}}
@keyframes xmas-star{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
@media (prefers-reduced-motion:reduce){.xmas-light,.xmas-star{animation:none}}
/* oldalmenü: sima háttér, lekerekített aktív pont */
.sidebar{background:var(--side)}
.side-nav a,.side-nav .linklike{border-radius:6px}
.side-nav a[aria-current]{clip-path:none;background:rgba(139,92,246,.2);box-shadow:none;position:relative}
.side-nav a[aria-current]::before{content:"";position:absolute;left:0;top:.55rem;bottom:.55rem;width:3px;border-radius:0 3px 3px 0;background:var(--accent-2)}
@media (max-width:900px){.sidebar{background:var(--side)}}
/* hero: a jobb oszlop töltse ki a magasságot */
@media (min-width:1101px){.pitch-top{align-items:center}}
@media (min-width:1400px){.pitch-asks a{font-size:1.24rem;padding:.3em .6em}.pitch-asks{gap:.75rem .65rem}.pitch-more{margin-bottom:1.1rem}}