/* 11am.pro. Generated by build_site.py from the redesign prototype; edit there, then rebuild.
   Layout: white page, ink only. Dotted wordmark hero, then a two-speed double column on home; case pages read as long single columns. */
@font-face{font-display:swap;font-family:'Sven';src:url(/fonts/sveningsson.ttf) format('truetype')}
@font-face{font-display:swap;font-family:'AHG';font-weight:700 900;src:url(/fonts/ahg-bold.ttf) format('truetype')}
@font-face{font-display:swap;font-family:'AHG';font-weight:400 600;src:url(/fonts/ahg-regular.ttf) format('truetype')}
@font-face{font-family:'Courier Prime';font-display:swap;font-weight:400;src:url(/fonts/courierprime-400.woff2) format('woff2')}
@font-face{font-family:'Courier Prime';font-display:swap;font-weight:700;src:url(/fonts/courierprime-700.woff2) format('woff2')}
@font-face{font-family:'Pixelify Sans';font-display:swap;font-weight:400 700;src:url(/fonts/pixelifysans.woff2) format('woff2')}
@font-face{font-family:'DotGothic16';font-display:swap;src:url(/fonts/dotgothic16-400.woff2) format('woff2')}
@font-face{font-family:'Dela Gothic One';font-display:swap;src:url(/fonts/delagothicone-400.woff2) format('woff2')}
@font-face{font-family:'Libre Barcode 39';font-display:swap;src:url(/fonts/librebarcode39-400.woff2) format('woff2')}
:root{
  --paper:#ffffff; --ink:#0a0a0a; --wash:#f2f2f2; --line:#d9d9d9;
  --body:'AHG','Helvetica Neue',Arial,sans-serif;
  --sen:'Sven','Helvetica Neue',Arial,sans-serif;
  --lab:'Courier Prime','Courier New',monospace;
  --cap:'Pixelify Sans','Courier New',monospace; --ck:1;
  --side:'Schibsted Grotesk',Arial,sans-serif;
  --ctt:'Schibsted Grotesk',Arial,sans-serif;
  --gut:48px; --head:92px;
  color-scheme:light;
}
@media (max-width:760px){:root{--gut:16px;--head:72px}}
html,body{background:var(--paper);color:var(--ink)}
body{font-family:var(--body);font-weight:500;font-size:17px;line-height:1.5;cursor:none;overflow-x:hidden}
a{color:inherit;cursor:none}
button,input,textarea,select,label{font:inherit;color:inherit;cursor:none}
p{margin:0}
.lab{font-family:var(--lab);font-size:11px;line-height:1.35;letter-spacing:0;font-weight:400}
.sen{font-family:var(--sen);font-weight:400;letter-spacing:-0.025em;line-height:1.04;margin:0;text-wrap:balance}
.jb{text-align:justify;hyphens:auto}
.ow{-webkit-text-stroke:1.2px var(--ink);color:transparent}
.bar{font-family:'Libre Barcode 39',monospace;line-height:1;font-weight:400}
.cap{font-family:var(--cap);text-transform:uppercase;line-height:1;font-weight:900}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

/* header */
#head{position:fixed;left:0;right:0;top:0;z-index:20;height:var(--head);box-sizing:border-box;padding:calc(env(safe-area-inset-top,0px) + 22px) var(--gut) 0;display:flex;justify-content:space-between;align-items:flex-start;background:var(--paper);transition:opacity .35s, transform .35s}
#head.ghost{opacity:0;pointer-events:none;transform:translateY(-8px)}
#head.clear{background:transparent}
#logo img{display:block;width:120px;height:auto;margin:-6px 0 0 -3px}
#nav{display:flex;gap:2px;flex-wrap:wrap;justify-content:flex-end}
#nav a{display:inline-flex;align-items:flex-start;gap:3px;min-height:40px;padding:5px 8px 0;box-sizing:border-box;text-decoration:none}
#nav a sup{font-size:8px;line-height:1}
#nav a b{font-weight:700}
#nav a.on,#nav a:hover{background:var(--ink);color:var(--paper)}
@media (max-width:760px){#nav a .nl{display:none}#logo img{width:96px}}

/* cursor */
#cur{position:fixed;left:0;top:0;z-index:60;pointer-events:none;transform:translate(-100px,-100px)}
#cur.off{opacity:0}
#cur .sq{position:absolute;left:-5px;top:-5px;width:10px;height:10px;background:var(--ink)}
#cur .ring{position:absolute;width:220px;height:220px;left:-110px;top:-110px;border:1px solid var(--ink);border-radius:50%;opacity:0;transition:opacity .25s}
#cur.lamp .ring{opacity:1}
#cur .tip{position:absolute;left:14px;top:8px;white-space:nowrap;background:var(--ink);color:var(--paper);padding:3px 6px}
@media (hover:none){#cur{display:none}body,a,button,input,textarea,select,label{cursor:auto}}

/* lamp */
.lamp{position:relative}
.lamp > .fill{position:absolute;inset:0;pointer-events:none;clip-path:circle(0px at -200px -200px)}
.lamp > .fill .ow{color:var(--ink);-webkit-text-stroke:1.2px var(--ink)}

/* big mixed titles */
.bt h2,.bt h1{margin:0;font-family:var(--side);font-weight:900;font-size:clamp(52px,7vw,104px);line-height:.88;letter-spacing:-.05em;white-space:nowrap}
body.mix .bt.mx1 h2{font-family:'Schibsted Grotesk',sans-serif}
body.mix .bt.mx2 h2{font-family:'DotGothic16',sans-serif;font-weight:400;letter-spacing:0;font-size:clamp(46px,6vw,90px);line-height:1;color:var(--ink);-webkit-text-stroke:0;filter:blur(.35px)}
body.mix .bt.mx3 h2{font-family:'Dela Gothic One',sans-serif;letter-spacing:0;font-size:clamp(40px,5vw,76px);line-height:1}
body.mix .bt.mx4 h2{font-family:'Sven',sans-serif;font-weight:400;letter-spacing:-.04em}

/* index rows */
.idx{display:flex;flex-direction:column}
.row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;padding:2px 8px;text-decoration:none;background:none;border:0;text-align:left;width:100%;box-sizing:border-box;min-height:28px}
.row.top{padding:8px 8px 5px;margin-top:10px;min-height:44px}
.row.top:first-child{margin-top:0}
.row .l{font-family:var(--lab);font-size:13px;padding-left:96px;min-width:0}
.row.top .l{font-family:var(--cap);font-weight:900;text-transform:uppercase;font-size:calc(24px * var(--ck));line-height:1;padding-left:0}
.row .r{display:flex;align-items:flex-start;gap:3px;white-space:nowrap;font-family:var(--lab)}
.row .r sup{font-size:9px;line-height:1}
.row .r b{font-weight:700;font-size:13px}
.row.top .r b{font-size:15px}
a.row:hover,button.row:hover,.row.sel{background:var(--ink);color:var(--paper)}
@media (max-width:760px){.row .l{padding-left:16px}}

/* footer */
.foot{display:flex;flex-direction:column;gap:6px;padding-block:64px 32px;container-type:inline-size}
.foot .bar{font-size:calc(100cqw / 5.2);white-space:nowrap;overflow:hidden}
.foot .meta{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* shells */
.page{min-height:100vh}
.wrap{padding-inline:var(--gut);padding-top:calc(var(--head) + 24px)}
.split{position:fixed;left:0;right:0;top:var(--head);bottom:0;display:flex}
.col{height:100%;overflow-y:auto;box-sizing:border-box;scrollbar-width:none;min-width:0}
.col::-webkit-scrollbar{display:none}
.col.l{flex:0 0 44%;padding:12px 24px 140px var(--gut)}
.col.r{flex:0 0 56%;padding:12px var(--gut) 0 24px}
.stack{display:flex;flex-direction:column;gap:72px}
.sect{display:flex;flex-direction:column;gap:18px;min-width:0}
h1.sen.big{font-size:clamp(40px,5.4vw,72px)}
h2.sen{font-size:clamp(28px,3.2vw,44px)}
h3.sen{font-size:clamp(22px,2.2vw,30px)}
.lead{font-size:clamp(17px,1.5vw,20px)}
.btns{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:var(--ink);color:var(--paper);text-decoration:none;border:0;font-family:var(--lab);font-size:12px;text-transform:lowercase}
.btn.line{background:none;color:var(--ink);box-shadow:inset 0 0 0 1.2px var(--ink)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:40px 48px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:28px 32px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px}
.stat{display:flex;flex-direction:column;gap:6px;min-width:0}
.stat .ow{font-family:'Schibsted Grotesk',sans-serif;font-weight:900;font-size:clamp(38px,4.4vw,60px);line-height:.9;letter-spacing:-.05em;white-space:nowrap}
.item{display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px}
.item b{font-weight:700}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px}
.kv div{display:flex;flex-direction:column;gap:4px}
.kv .v{font-family:var(--sen);font-size:22px;letter-spacing:-.02em}
@media (max-width:760px){.split{flex-direction:column}.col.l,.col.r{flex:0 0 50%;padding:12px var(--gut) 80px}}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:28px}
.card{display:flex;flex-direction:column;gap:12px;text-decoration:none;min-width:0}
.card .im{aspect-ratio:4/3;max-width:100%;overflow:hidden;background:var(--wash);position:relative}
.card .im img{display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transition:transform .5s}
.card:hover .im img{transform:scale(1.04)}
.card .im .lab{position:absolute;left:10px;bottom:8px;background:var(--paper);padding:2px 5px}
.card .t{font-family:var(--sen);font-size:clamp(24px,2.4vw,32px);letter-spacing:-.025em;line-height:1.05}
.card .go{font-family:var(--lab);font-size:12px}
.card.draft .im::after{content:'draft';position:absolute;right:10px;top:8px;font-family:var(--lab);font-size:11px;background:var(--ink);color:var(--paper);padding:2px 6px}

/* home hero */
#hero{position:relative;height:300vh}
#stage{position:sticky;top:0;height:100vh;overflow:hidden}
#dots{position:absolute;inset:0;width:100%;height:100%;display:block}
#heroFoot{position:absolute;left:var(--gut);right:var(--gut);bottom:28px;display:flex;justify-content:space-between;gap:12px;transition:opacity .3s}
.tagline{position:absolute;left:var(--gut);right:var(--gut);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:22px;opacity:0;pointer-events:none}
.tagline .sen{font-size:clamp(34px,5vw,68px)}
#typed{font-family:var(--lab);font-weight:700;font-size:clamp(28px,4.4vw,60px);line-height:1.08;letter-spacing:-.02em;margin:0;min-height:2.2em}
#typed i{display:inline-block;width:.55em;height:.9em;background:var(--ink);vertical-align:-.08em;margin-left:.04em}
#tiles{position:absolute;left:var(--gut);right:var(--gut);top:calc(var(--head) + 8px);bottom:64px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:12px}
#tiles .t{min-height:0;overflow:hidden;opacity:0;transform:scale(.92);transition:opacity .25s, transform .35s}
#tiles .t img{display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated}
#tiles .tt{width:100%;height:100%;box-sizing:border-box;padding:10px;display:flex;flex-direction:column;justify-content:space-between;background:var(--wash)}
#tiles .ag{display:grid;gap:6px;box-sizing:border-box;padding:6px;background:transparent}
#tiles .ag a{display:block;min-width:0;min-height:0;overflow:hidden}
#tiles .ag img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}
#tiles .ag.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
#tiles .ag.g2{grid-template-columns:repeat(2,minmax(0,1fr));align-content:center}
#tiles .ag.br{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:1fr 1fr}
#tiles .ag.br a:nth-child(1){grid-column:2;grid-row:2}
#tiles .ag.br a:nth-child(2){grid-column:3;grid-row:2}
#tiles .ag.one{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
#tiles .ag.one a{width:100%;height:100%}
#tiles .ag.tl a{grid-column:1;grid-row:1}
#tiles .ag.bl a{grid-column:1;grid-row:2}
#tiles .ag.midc a{grid-column:1 / span 2;grid-row:1 / span 2;width:72%;height:72%;justify-self:center;align-self:center}
#tiles .ag.br1 a{grid-column:2;grid-row:2}
#tiles .tt .ow{font-family:'Schibsted Grotesk',sans-serif;font-weight:900;font-size:clamp(28px,3.6vw,54px);line-height:.9;letter-spacing:-.05em}
#tiles .mid{grid-column:2/span 4;grid-row:2/span 2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}
#tiles .mid .sen{font-size:clamp(26px,3vw,40px)}
@media (max-width:760px){#tiles .mid{grid-column:1/-1;grid-row:auto}}

/* home two-speed columns */
#duo{position:relative}
#duo .sticky{position:sticky;top:0;height:100vh;display:flex;overflow:hidden;padding-top:var(--head);box-sizing:border-box}
#duo .c{position:relative;overflow:hidden;min-width:0}
#duo .c.a{flex:0 0 50%}
#duo .c.b{flex:0 0 50%}
#duo .tr{position:absolute;left:0;top:0;width:100%;will-change:transform;box-sizing:border-box}
#duo .a .tr{padding:16px 24px 120px var(--gut)}
#duo .b .tr{padding:16px var(--gut) 120px 24px}
body.counter #duo .a .stack{flex-direction:column-reverse}
@media (max-width:760px){
  body.counter #duo .a .stack{flex-direction:column}
  #duo{height:auto!important}#duo .sticky{position:static;height:auto;display:block;padding-top:0}
  #duo .c{overflow:visible}#duo .tr{position:static;transform:none!important;padding:16px var(--gut) 24px!important}
}

/* hq */
.fig{display:flex;flex-direction:column;gap:8px}
.frame{border:1.2px solid var(--ink);background:var(--paper)}
.frame .bar2{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;border-bottom:1.2px solid var(--ink)}
.frame iframe{display:block;width:100%;height:min(76vh,720px);border:0;background:#fff}
.tour{display:flex;flex-wrap:wrap;gap:4px}
.tour button{border:0;background:var(--wash);padding:6px 10px;min-height:34px;font-family:var(--lab);font-size:11px;text-transform:lowercase}
.tour button[aria-pressed="true"],.tour button:hover{background:var(--ink);color:var(--paper)}
.show{border:0;background:none;padding:0;font-family:var(--lab);font-size:12px;text-decoration:underline;text-underline-offset:3px;align-self:flex-start;min-height:28px}
.ba{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:28px}
.ba .side{display:flex;flex-direction:column;gap:8px}
.ba .tool{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:8px 10px;background:var(--wash)}
.ba .tool b{font-weight:700}
.ba .own{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ba .own span{padding:10px;background:var(--ink);color:var(--paper);font-family:var(--lab);font-size:12px}
.ba .own .core{grid-column:1/-1;background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1.2px var(--ink)}
.bars{display:flex;flex-direction:column;gap:6px}
.bars div{display:grid;grid-template-columns:160px minmax(0,1fr);gap:12px;align-items:center}
.bars i{display:block;height:10px;background:var(--ink)}
.result{padding:16px;box-shadow:inset 0 0 0 1.2px var(--ink);display:flex;flex-direction:column;gap:8px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips span{font-family:var(--lab);font-size:11px;padding:3px 7px;background:var(--wash)}
.chips span.miss{background:var(--ink);color:var(--paper)}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline}

/* toolkit + forms */
.tl{display:flex;flex-direction:column;gap:22px}
.tm{display:flex;flex-direction:column;gap:6px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.tm .h{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.tm .h a{font-family:var(--sen);font-size:clamp(22px,2.2vw,28px);letter-spacing:-.02em;text-decoration:none}
.tm .h a:hover{text-decoration:underline}
.risk{font-family:var(--lab);font-size:11px;padding:2px 6px;box-shadow:inset 0 0 0 1px var(--ink)}
.risk.L{background:var(--paper)}
.risk.M{background:var(--ink);color:var(--paper)}
.check{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:center;padding:6px 8px;min-height:40px}
.check input{width:16px;height:16px;accent-color:#0a0a0a;margin:0}
.check:hover{background:var(--wash)}
.rrow{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-bottom:1px solid var(--line)}
.rrow .p{font-family:var(--sen);font-size:22px;letter-spacing:-.02em}
.fld{width:100%;box-sizing:border-box;border:0;background:var(--wash);padding:12px 14px;font-family:var(--body);font-size:17px;min-height:48px;outline:none}
.fld:focus{box-shadow:inset 0 0 0 1.2px var(--ink)}
.flab{display:flex;flex-direction:column;gap:6px}
.curr{display:inline-flex;gap:2px}
.curr button{border:0;background:var(--wash);padding:5px 9px;min-height:30px;font-family:var(--lab);font-size:11px}
.curr button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
#feeOut{font-family:'Schibsted Grotesk',sans-serif;font-weight:900;font-size:clamp(48px,7vw,104px);line-height:.9;letter-spacing:-.05em}
#contactBig{font-family:var(--ctt);font-weight:900;font-size:clamp(48px,9.6vw,150px);line-height:.88;letter-spacing:-.055em;margin:0}

/* collective embed */
#cframe,#cloop{display:block;width:100%;border:0;background:transparent}
#cframe{height:640px}
#cloop{height:560px}
.teaser-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,280px);gap:40px;align-items:center}
.teaser-copy{display:flex;flex-direction:column;gap:14px;min-width:0}
.teaser-copy h2{margin:0}
.teaser{margin:0}
.teaser video{display:block;width:100%;height:auto;aspect-ratio:9/16;background:#111;border-radius:28px}
.teaser .lab{display:block;margin-top:8px}
@media (max-width:760px){.teaser-row{grid-template-columns:1fr}.teaser{max-width:240px}}

@media (prefers-reduced-motion:reduce){#tiles .t,#head,.card .im img{transition:none}}


/* ---------- standalone pages ---------- */
body{cursor:none}
.ahero{position:relative;height:220vh}
.ahero .stage{position:sticky;top:0;height:100vh;overflow:hidden}
.ahero canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.ahfoot{position:absolute;left:var(--gut);right:var(--gut);bottom:28px;display:flex;justify-content:space-between;gap:12px}
.atag{position:absolute;left:var(--gut);right:var(--gut);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;opacity:0;pointer-events:none}
.atag .sen{font-size:clamp(40px,6.4vw,96px)}
.atag .sub{font-family:var(--sen);font-size:clamp(22px,2.6vw,36px);letter-spacing:-.02em;line-height:1.1;margin:0;max-width:22ch}
.ahero.still{height:auto}
.ahero.still .stage{position:relative;height:auto;display:flex;flex-direction:column;padding-top:var(--head)}
.ahero.still canvas{position:relative;height:56vh}
.ahero.still .ahfoot{position:static;padding:12px var(--gut) 0}
.ahero.still .atag{position:static;transform:none;opacity:1;padding:32px var(--gut) 0}
.card .im canvas{display:block;width:100%;height:100%}
.card .im .no{left:auto;right:10px}
.ask{padding:18px;box-shadow:inset 0 0 0 1.2px var(--ink);display:flex;flex-direction:column;gap:12px}
.ask q{font-family:var(--sen);font-size:clamp(24px,2.6vw,34px);letter-spacing:-.02em;line-height:1.08;quotes:'\201C' '\201D'}
.flow{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.flow a{font-family:var(--cap);text-transform:uppercase;font-weight:900;font-size:calc(20px * var(--ck));line-height:1;text-decoration:none;padding:6px 8px 4px}
.flow a:hover{background:var(--ink);color:var(--paper)}
.flow i{font-style:normal;font-family:var(--lab);font-size:13px}
.flows{display:flex;flex-direction:column;gap:18px}
.flows > div{display:flex;flex-direction:column;gap:4px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.pn{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pn a{display:flex;flex-direction:column;gap:6px;padding:14px;background:var(--wash);text-decoration:none;min-width:0}
.pn a:last-child{text-align:right;align-items:flex-end}
.pn a:hover{background:var(--ink);color:var(--paper)}
.pn .sen{font-size:clamp(22px,2.2vw,30px)}
@media (max-width:760px){.atag .sen{font-size:clamp(36px,11vw,64px)}}
@media (prefers-reduced-motion:reduce){.card .im canvas{transition:none}}

/* ---------- live site ---------- */
/* the design tool's page wrapper zeroed these; without it the whole page sits 8px low */
html,body{margin:0;padding:0}
/* long figures shrink to their column instead of running into the next one */
.stat{container-type:inline-size}
.stat .ow{font-size:min(clamp(38px,4.4vw,60px),24cqi)}
body.splitpage{overflow:hidden}
/* big mixed titles never wrap on desktop; on phones they must, or they run off the edge */
@media (max-width:760px){.bt h1,.bt h2{white-space:normal;overflow-wrap:anywhere}}
.skip{position:absolute;left:var(--gut);top:-60px;z-index:70;background:var(--ink);color:var(--paper);padding:8px 12px;text-decoration:none}
.skip:focus{top:12px}
/* reduced motion: the finished dotted wordmark and the tile grid, still; columns stack */
body.rm #hero{height:auto}
body.rm #stage{position:relative;height:auto;overflow:visible;display:flex;flex-direction:column;padding-top:var(--head)}
body.rm #dots{position:relative;height:62vh}
body.rm #heroFoot{position:static;padding:0 var(--gut) 24px}
body.rm #tiles{position:relative;left:auto;right:auto;top:auto;bottom:auto;height:min(86vh,860px);margin:0 var(--gut) 24px}
body.rm #tiles .t,body.rm #tiles .mid{opacity:1!important;transform:none!important}
body.rm #duo{height:auto!important}
body.rm #duo .sticky{position:static;height:auto;display:block;padding-top:0}
body.rm #duo .c{overflow:visible}
body.rm #duo .tr{position:static;transform:none!important;padding:16px var(--gut) 24px!important}
body.rm.counter #duo .a .stack{flex-direction:column}

/* ---------- phone ---------- */
html{-webkit-text-size-adjust:100%}
@media (max-width:760px){
  :root{--gut:16px;--head:calc(108px + env(safe-area-inset-top,0px))}
  #head{flex-wrap:wrap;align-items:center;row-gap:4px;height:auto;min-height:var(--head);padding:calc(env(safe-area-inset-top,0px) + 8px) max(var(--gut),env(safe-area-inset-right)) 8px max(var(--gut),env(safe-area-inset-left))}
  #logo img{width:72px;margin:0}
  #nav{flex:1 1 100%;flex-wrap:nowrap;justify-content:space-between;gap:0}
  #nav a{flex:1;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:44px;padding:2px 0 0}
  #nav a .nl{display:block;font-size:10px;line-height:1.1}
  body.splitpage{overflow:auto}
  .split{position:relative;top:auto;bottom:auto;left:auto;right:auto;height:auto;flex-direction:column;padding-top:var(--head)}
  .col{height:auto;overflow:visible}
  .col.l,.col.r{flex:1 1 auto;width:auto;padding:8px var(--gut) 32px}
  .stack{gap:48px}
  .row{gap:10px;align-items:start;min-height:44px;padding:8px 0}
  .row .l{padding-left:0;overflow-wrap:anywhere}
  .row.top .l{font-size:clamp(16px,5vw,22px)}
  h1.sen.big{font-size:clamp(34px,10vw,56px)}
  #catName{font-size:clamp(28px,8vw,64px)!important;overflow-wrap:anywhere}
  .bars div{grid-template-columns:minmax(72px,34%) minmax(0,1fr);gap:8px}
  .frame .bar2{flex-wrap:wrap;gap:6px}
  .frame iframe{height:min(70vh,640px)}
  .tour button,.curr button{min-height:44px;padding:8px 12px}
  .check{min-height:48px}
  .check input{width:22px;height:22px}
  .foot{padding-block:40px calc(24px + env(safe-area-inset-bottom,0px))}
  .pn{grid-template-columns:1fr}
  .pn a:last-child{text-align:left;align-items:flex-start}
  .ahero{height:145vh}
  .ahfoot{flex-wrap:wrap;row-gap:4px}
  .ahfoot span{min-width:0}
  .teaser{max-width:min(280px,78vw);justify-self:center}
  #duo .sticky{display:flex;flex-direction:column}
  #duo .c.b{order:-1}
  #hero{height:auto}
  #stage{position:relative;height:auto;overflow:visible;display:flex;flex-direction:column;padding-top:var(--head)}
  #dots{position:relative;inset:auto;width:100%;height:min(42vh,320px);flex:none}
  #heroFoot{position:static;order:1;padding:8px var(--gut) 0;flex-wrap:wrap}
  #heroFoot span:nth-child(2){display:none}
  #tiles{position:relative;left:auto;right:auto;top:auto;bottom:auto;order:2;height:auto;margin:16px var(--gut) 12px;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:auto;gap:10px}
  #tiles .t{grid-column:auto!important;grid-row:auto!important;opacity:1!important;transform:none!important;aspect-ratio:1}
  #tiles .t:not(.ag):not(:has(.tt)){display:none!important}
  #tiles .t.ag{display:grid!important}
  #tiles .mid{grid-column:1/-1!important;grid-row:auto!important;order:-1;opacity:1!important;padding:4px 0 8px}
  #tiles .mid .sen{font-size:clamp(28px,8vw,40px)}
  #tiles .ag.g3{grid-column:1/-1!important;aspect-ratio:3.1/1}
  #tiles .ag.one{grid-template-columns:1fr;grid-template-rows:1fr}
  #tiles .ag.one a,#tiles .ag.tl a,#tiles .ag.bl a,#tiles .ag.midc a,#tiles .ag.br1 a{grid-column:1!important;grid-row:1!important;width:72%!important;height:72%!important;justify-self:center;align-self:center}
  #tiles .ag.br{grid-template-columns:1fr 1fr;grid-template-rows:1fr;align-items:center}
  #tiles .ag.br a{grid-column:auto!important;grid-row:1!important;width:100%;height:78%;align-self:center}
  #tiles .t:has(.tt){display:block!important;grid-column:1/-1!important;order:8;aspect-ratio:auto;min-height:96px}
  #tiles .tt{background:transparent}
  body.rm #hero{height:auto}
  body.rm #stage{position:relative;height:auto;overflow:visible;display:flex;flex-direction:column;padding-top:var(--head)}
  body.rm #dots{position:relative;height:min(42vh,320px)}
  body.rm #heroFoot{position:static;padding:8px var(--gut) 0}
  body.rm #tiles{position:relative;left:auto;right:auto;top:auto;bottom:auto;height:auto;margin:16px var(--gut) 12px}
}