[data-ui="atelier-v1"]{--atelier-void:#100B0D;--atelier-stone:#140E10;--ease-atelier:cubic-bezier(.22,.7,.25,1);--lift:clamp(0px,calc(695px - 100svh),110px);background:var(--atelier-void)}
[data-ui="atelier-v1"]:has(>body[data-screen="page"]){background:var(--stage)}
[data-ui="atelier-v1"] body{background:none;--stage-h:600px;--stage-fade:180px}
[data-ui="atelier-v1"] body[data-screen="results"],[data-ui="atelier-v1"] body[data-screen="zero"]{--stage-h:420px;--stage-fade:120px}
[data-ui="atelier-v1"] body[data-screen="entity"],[data-ui="atelier-v1"] body[data-screen="listing"]{--stage-h:220px;--stage-fade:120px}
[data-ui="atelier-v1"] body:not([data-screen="page"]) .topbar{background:none;border-bottom:0}
[data-ui="atelier-v1"] .age-mark{background:var(--stage);white-space:nowrap}
[data-ui="atelier-v1"] main.page{overflow-x:clip}

/* z0–1 stage */
[data-ui="atelier-v1"] .stage{position:absolute;z-index:0;top:0;left:0;right:0;height:var(--stage-h);overflow:hidden;pointer-events:none;-webkit-mask-image:linear-gradient(transparent,#000 56px,#000 calc(100% - var(--stage-fade)),transparent);mask-image:linear-gradient(transparent,#000 56px,#000 calc(100% - var(--stage-fade)),transparent)}
[data-ui="atelier-v1"] .gallery{width:100%;height:100%;object-fit:cover;object-position:55% 43%;transform-origin:55% 43%;transform:scale(1.04)}
[data-ui="atelier-v1"] body[data-screen="entity"] .gallery,[data-ui="atelier-v1"] body[data-screen="listing"] .gallery{object-position:55% 0%}
[data-ui="atelier-v1"] .portal{position:absolute;top:0;left:0;width:100%;height:auto;max-width:none;transform-origin:55% 43%}

/* z2–4 DOKUNA, counter group, hand */
[data-ui="atelier-v1"] .fig{transform-origin:0 0}
[data-ui="atelier-v1"] .fig.dokuna{z-index:2}
[data-ui="atelier-v1"] .fig.hand{z-index:4}
[data-ui="atelier-v1"] .counter-group{position:absolute;z-index:3;pointer-events:none}
[data-ui="atelier-v1"] .counter-img{position:absolute;left:0;top:0;width:100%;height:auto;max-width:none}
[data-ui="atelier-v1"] .counter-plate{position:absolute;left:0;right:0;top:118px;bottom:0;background:var(--atelier-stone);border-radius:50% 50% 0 0/14px}
[data-ui="atelier-v1"] .counter-plate::after{content:"";position:absolute;left:0;right:0;top:0;height:28px;border-top:2px solid var(--metal);border-radius:inherit}

/* surfaces (R1, R4) */
[data-ui="atelier-v1"] .panel,[data-ui="atelier-v1"] .ledger,[data-ui="atelier-v1"] .qbar,[data-ui="atelier-v1"] .voice-plate,[data-ui="atelier-v1"] .provider,[data-ui="atelier-v1"] .exhibit.best .caption{position:relative;z-index:7;background:var(--surface);border:1px solid var(--line-strong);border-radius:12px}
[data-ui="atelier-v1"] .panel{padding:16px}
[data-ui="atelier-v1"] .chip{background:var(--surface);border-color:var(--line-on-surface)}
[data-ui="atelier-v1"] .chip[aria-pressed="true"]{border-color:var(--accent)}
[data-ui="atelier-v1"] .search input,[data-ui="atelier-v1"] .provider .btn-secondary{border-color:var(--line-on-surface)}
[data-ui="atelier-v1"] .voice{z-index:6}
/* 44px hit area for 12px credit links */
[data-ui="atelier-v1"] .pagefoot a,[data-ui="atelier-v1"] .credit a,[data-ui="atelier-v1"] .footer-credits a{display:inline-block;padding:14px 0;margin:-14px 0}

/* Home and Gate (§3.1, §3.8) */
[data-ui="atelier-v1"] .home,[data-ui="atelier-v1"] .gate{height:auto;min-height:max(796px,calc(100svh - 48px));overflow:hidden;background:none}
[data-ui="atelier-v1"] .home .fig,[data-ui="atelier-v1"] .gate .fig{left:-28px;top:calc(174px - var(--lift));width:470px;transform:var(--pose);transition:none}
[data-ui="atelier-v1"] .home .counter-group,[data-ui="atelier-v1"] .gate .counter-group{left:-18px;top:calc(359px - var(--lift));width:426px;height:1000px;transform:var(--counter-pose)}
[data-ui="atelier-v1"] .home .counter-plate,[data-ui="atelier-v1"] .gate .counter-plate{right:-120px}
[data-ui="atelier-v1"] .home .ui-col,[data-ui="atelier-v1"] .gate .ui-col{padding:calc(538px - var(--lift)) 16px 24px}
[data-ui="atelier-v1"] .home .voice,[data-ui="atelier-v1"] .gate .voice{position:absolute;z-index:8;left:16px;right:auto;top:calc(40px - min(var(--lift),24px));max-inline-size:calc(100% - 32px);padding:11px 15px;font-size:24px;background:var(--surface);border:1px solid var(--line-strong);border-radius:12px;transition:none}
[data-ui="atelier-v1"] .home.compact .voice .p{display:inline-block}
[data-ui="atelier-v1"] .home .counter{position:relative;z-index:7;inset:auto;display:block;padding:16px;border:1px solid var(--line-strong);transform:var(--dock-pose);transition:none}
[data-ui="atelier-v1"] .home .counter .mods{flex-wrap:nowrap}
[data-ui="atelier-v1"] .home .counter .chip{flex:1 1 0;min-width:0;padding:0 8px}
[data-ui="atelier-v1"] .home .counter .legal{margin-top:16px;padding:0}
[data-ui="atelier-v1"] .gate .sheet{position:relative;z-index:7;inset:auto;border-color:var(--accent)}
[data-ui="atelier-v1"] body[data-screen="home"] .site-footer,[data-ui="atelier-v1"] body[data-screen="gate"] .site-footer{margin-top:0}

/* Focus (§3.2) */
@media (max-width:767px){
[data-ui="atelier-v1"] .home.compact{--pose:translate(10px,calc(var(--lift) - 152px)) scale(.5149);--counter-pose:translateY(calc(var(--lift) - 329px));--dock-pose:translateY(calc(var(--lift) - 312px))}
[data-ui="atelier-v1"] .home.compact .counter{padding-top:84px}
[data-ui="atelier-v1"] .home.compact .voice{left:32px;top:242px;max-inline-size:326px;padding:0;font-size:20px;background:none;border-color:transparent}
[data-ui="atelier-v1"] body:has(.home.compact) .gallery{transform:translateY(-5.2px) scale(1.0758)}
}
@media (max-width:767px) and (max-height:599px){
[data-ui="atelier-v1"] .home{--pose:translate(10px,calc(var(--lift) - 152px)) scale(.5149);--counter-pose:translateY(calc(var(--lift) - 329px));--dock-pose:translateY(calc(var(--lift) - 312px))}
[data-ui="atelier-v1"] .home .counter{padding-top:84px}
[data-ui="atelier-v1"] .home .voice{left:32px;top:242px;max-inline-size:326px;padding:0;font-size:20px;background:none;border-color:transparent}
[data-ui="atelier-v1"] body:has(.home.compact) .gallery{transform:scale(1.04)}
}

/* Results (§3.3) */
[data-ui="atelier-v1"] .qbar{margin:12px 16px 0;padding:6px}
[data-ui="atelier-v1"] .qbar .field-label{padding-left:10px}
[data-ui="atelier-v1"] .band{display:flow-root;height:auto;min-height:120px;margin:12px 0 54px}
[data-ui="atelier-v1"] .band .clip{z-index:2}
[data-ui="atelier-v1"] .band .counter-group{left:-18px;top:-9px;bottom:-54px;width:426px;overflow:hidden;border-radius:0 0 50% 50%/0 0 14px 14px}
[data-ui="atelier-v1"] .voice-plate{z-index:6;margin:8px 16px -38px 128px;padding:12px 10px}
[data-ui="atelier-v1"] .voice-plate .voice{position:static;max-inline-size:none}
[data-ui="atelier-v1"] .voice-plate .se{margin:4px 0 0}
[data-ui="atelier-v1"] .ask{position:relative;z-index:7;margin:16px 16px 0}
[data-ui="atelier-v1"] .exhibit{position:relative;z-index:5;display:block;color:inherit;text-decoration:none}
[data-ui="atelier-v1"] .exhibit.best{margin:16px 16px 0;padding:0;background:none;border:0;border-radius:0}
[data-ui="atelier-v1"] .mount{display:flex;flex-direction:column;align-items:center}
[data-ui="atelier-v1"] .mount .jk{position:relative;z-index:1;margin:0;background:var(--surface);border-color:var(--metal)}
[data-ui="atelier-v1"] .pedestal{width:240px;height:108px;max-width:none;margin-top:-46px}
[data-ui="atelier-v1"] .exhibit.best .caption{margin-top:8px;padding:16px;border-color:var(--accent)}
[data-ui="atelier-v1"] .exhibit.tile{display:flex;flex-direction:column;min-width:0}
[data-ui="atelier-v1"] .tile .mount .jk{width:84%}
[data-ui="atelier-v1"] .tile .pedestal{width:100%;height:auto;margin-top:-19%}
[data-ui="atelier-v1"] .tile .caption{display:flex;flex-direction:column;gap:4px;margin-top:4px}
[data-ui="atelier-v1"] .ledger{margin:16px 16px 0;padding:0 16px}
[data-ui="atelier-v1"] .ledger .countrow{margin:0}
[data-ui="atelier-v1"] .ledger .conds{margin:0 0 8px}
[data-ui="atelier-v1"] .ledger .entity-chips{margin:4px 0 12px}
[data-ui="atelier-v1"] .ledger .list,[data-ui="atelier-v1"] .ledger .others{margin:0}
[data-ui="atelier-v1"] .ledger .list>li:last-child>.row{border-bottom:0}
[data-ui="atelier-v1"] .row .foot{flex-wrap:wrap}
[data-ui="atelier-v1"] .row .foot .store{white-space:nowrap}
[data-ui="atelier-v1"] .row .foot .pricerow{flex:1 1 auto}
[data-ui="atelier-v1"] .ledger .jk{background:var(--stage)}
[data-ui="atelier-v1"] .ledger .grid{margin:4px 0 16px}
[data-ui="atelier-v1"] .ledger .collapse{border:0}
[data-ui="atelier-v1"] .ledger .others .list{border-top:1px solid var(--line)}
[data-ui="atelier-v1"] .ledger .sec-h{margin:16px 0 0;padding-top:16px;border-top:1px solid var(--line)}
[data-ui="atelier-v1"] .empty.panel{margin:16px 16px 0}
[data-ui="atelier-v1"] body[data-screen="failed"] main{min-height:536px;overflow:clip}
[data-ui="atelier-v1"] body[data-screen="failed"] .counter-group{left:-18px;top:252px;width:426px;height:284px;overflow:hidden;border-radius:0 0 50% 50%/0 0 14px 14px}
[data-ui="atelier-v1"] body[data-screen="failed"] .empty.panel{margin-top:287px}

/* Entity, listing (§3.7) */
[data-ui="atelier-v1"] .pagehead.panel{margin:16px 16px 0}
[data-ui="atelier-v1"] .provider{margin:24px 16px 0;padding:16px}
[data-ui="atelier-v1"] .provider+.provider{margin-top:24px;padding-top:16px;border-top:1px solid var(--line-strong)}
[data-ui="atelier-v1"] section.provider:has(.offer.cheapest){border-color:var(--accent)}
[data-ui="atelier-v1"] .provider .offer{margin-top:16px;padding:0;background:none;border:0;border-radius:0}
[data-ui="atelier-v1"] .provider .offer+.offer{padding-top:16px;border-top:1px solid var(--line)}
[data-ui="atelier-v1"] .offers .offer,[data-ui="atelier-v1"] .offers .offer+.offer{padding:12px;border:1px solid var(--line-on-surface);border-radius:8px}
[data-ui="atelier-v1"] .offers .offer.cheapest{border-color:var(--accent)}
[data-ui="atelier-v1"] .provider .jk{background:var(--stage)}
[data-ui="atelier-v1"] .facts dd.num{white-space:nowrap}
[data-ui="atelier-v1"] .sendoff{align-items:flex-end;margin-top:24px}
[data-ui="atelier-v1"] .sendoff .voice-plate{flex:1;min-width:0;margin:0;text-align:right}
[data-ui="atelier-v1"] .grid.exhibits{margin:12px 16px 0}

/* 320 (§4) */
@media (max-width:359px){
[data-ui="atelier-v1"] .home .fig,[data-ui="atelier-v1"] .gate .fig{left:-48px;top:calc(178px - var(--lift));width:435px}
[data-ui="atelier-v1"] .home .voice,[data-ui="atelier-v1"] .gate .voice{left:12px;max-inline-size:calc(100% - 24px);font-size:22px}
[data-ui="atelier-v1"] .home.compact{--pose:translate(30px,calc(var(--lift) - 156px)) scale(.5563)}
[data-ui="atelier-v1"] .home.compact .voice{left:28px;max-inline-size:264px}
[data-ui="atelier-v1"] .home .ui-col,[data-ui="atelier-v1"] .gate .ui-col{padding-left:12px;padding-right:12px}
[data-ui="atelier-v1"] .home .counter .mods{flex-wrap:wrap}
[data-ui="atelier-v1"] .home .counter .chip{flex-basis:40%}
[data-ui="atelier-v1"] .qbar,[data-ui="atelier-v1"] .ask,[data-ui="atelier-v1"] .exhibit.best,[data-ui="atelier-v1"] .ledger,[data-ui="atelier-v1"] .empty.panel,[data-ui="atelier-v1"] .pagehead.panel,[data-ui="atelier-v1"] .provider,[data-ui="atelier-v1"] .grid.exhibits{margin-left:12px;margin-right:12px}
[data-ui="atelier-v1"] .voice-plate{margin-left:116px;margin-right:12px;padding:12px 10px}
}
@media (max-width:359px) and (max-height:599px){
[data-ui="atelier-v1"] .home{--pose:translate(30px,calc(var(--lift) - 156px)) scale(.5563)}
[data-ui="atelier-v1"] .home .voice{left:28px;max-inline-size:264px;font-size:20px}
}

/* 200% text (≤280, §4): everything in flow */
@media (max-width:280px){
[data-ui="atelier-v1"] .topbar,[data-ui="atelier-v1"] .topbar .bar{height:auto;min-height:48px}
[data-ui="atelier-v1"] .brand{flex:1 1 auto;min-width:0}
[data-ui="atelier-v1"] .home,[data-ui="atelier-v1"] .home.compact,[data-ui="atelier-v1"] .gate{--pose:translate(30px,calc(var(--lift) - 156px)) scale(.5563);--counter-pose:translateY(calc(var(--lift) - 329px));--dock-pose:none;min-height:0}
[data-ui="atelier-v1"] .home .ui-col,[data-ui="atelier-v1"] .gate .ui-col{padding-top:226px}
[data-ui="atelier-v1"] .home .voice,[data-ui="atelier-v1"] .home.compact .voice,[data-ui="atelier-v1"] .gate .voice{position:relative;inset:auto;z-index:8;margin:0 0 12px;padding:11px 15px;max-inline-size:none;font-size:20px;background:var(--surface);border:1px solid var(--line-strong);opacity:1;transition:none}
[data-ui="atelier-v1"] .home .counter,[data-ui="atelier-v1"] .home.compact .counter{padding-top:16px}
[data-ui="atelier-v1"] .band{margin-bottom:24px}
[data-ui="atelier-v1"] .collapse .peek{display:none}
[data-ui="atelier-v1"] .voice-plate{margin:174px 12px 0}
[data-ui="atelier-v1"] .grid.exhibits{grid-template-columns:1fr}
[data-ui="atelier-v1"] .pedestal{width:100%;height:auto;margin-top:-19%}
}

/* ≥768 (§4.1): 1120 shell, stage fixed in the left column at --u px per reference px */
@media (min-width:768px){
[data-ui="atelier-v1"]{--X:max(0px,calc((100% - 1120px)/2));--R:max(380px,calc(min(100vw,1120px)*.45));--W:calc(min(100vw,1120px) - var(--R));--rim:calc(100svh - var(--W)*.42);--u:max(.5px,min(calc(var(--W)/440),calc((var(--rim) - 56px)/290)));--cx:calc(var(--X) + (min(100%,1120px) - var(--R))/2)}
[data-ui="atelier-v1"] body:not([data-screen="page"]) .topbar{position:absolute;left:0;right:0;top:0}
[data-ui="atelier-v1"] body:not([data-screen="page"]) .topbar .bar{max-width:1120px}
[data-ui="atelier-v1"] body:not([data-screen="page"]) main.page{display:grid;grid-template-columns:minmax(0,1fr) var(--R);align-content:start;max-width:1120px;min-height:100svh;padding:64px 0 48px;z-index:1}
[data-ui="atelier-v1"] body:not([data-screen="page"]) main.page::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;right:0;width:var(--R);background:var(--stage)}
[data-ui="atelier-v1"] body:not([data-screen="page"]) main.page>*{grid-column:2;min-width:0}
[data-ui="atelier-v1"] body:not([data-screen="page"]) .site-footer{position:relative;z-index:1;max-width:1120px;margin:0 auto;border:0}
[data-ui="atelier-v1"] body:not([data-screen="page"]) .site-footer .wrap{width:var(--R);max-width:none;margin:0 0 0 auto;padding:16px 16px 32px;background:var(--stage);border-top:1px solid var(--line)}
[data-ui="atelier-v1"] .stage,[data-ui="atelier-v1"] .stage-col,[data-ui="atelier-v1"] .band .clip{position:fixed;top:0;bottom:0;left:var(--X);right:calc(var(--X) + var(--R));height:auto;overflow:hidden;-webkit-mask-image:none;mask-image:none}
[data-ui="atelier-v1"] .stage-col,[data-ui="atelier-v1"] .band .clip{z-index:2;pointer-events:none}
[data-ui="atelier-v1"] body[data-screen] .gallery{object-position:55% 43%}
[data-ui="atelier-v1"] main.page .fig.dokuna{left:calc(50% - var(--u)*223);top:calc(var(--rim) - var(--u)*290);width:calc(var(--u)*470);transform:none}
[data-ui="atelier-v1"] main.page .fig.hand{position:fixed;left:calc(var(--cx) - var(--u)*223);top:calc(var(--rim) - var(--u)*290);width:calc(var(--u)*470);transform:none}
[data-ui="atelier-v1"] main.page .counter-group{position:fixed;left:var(--X);right:calc(var(--X) + var(--R));top:calc(var(--rim) - var(--W)*.2465);bottom:0;width:auto;height:auto;overflow:visible;border-radius:0;transform:none}
[data-ui="atelier-v1"] .counter-plate{top:calc(var(--W)*.277)}
[data-ui="atelier-v1"] .home,[data-ui="atelier-v1"] .gate{min-height:0;overflow:visible}
[data-ui="atelier-v1"] .home .ui-col,[data-ui="atelier-v1"] .gate .ui-col{padding:0}
[data-ui="atelier-v1"] .home .voice,[data-ui="atelier-v1"] .gate .voice,[data-ui="atelier-v1"] .home.compact .voice{position:static;margin:0 16px 24px;padding:0;max-inline-size:none;font-size:24px;background:none;border:0;opacity:1;transition:none}
[data-ui="atelier-v1"] .home .counter,[data-ui="atelier-v1"] .gate .sheet{margin:0 16px}
[data-ui="atelier-v1"] .band{display:contents}
[data-ui="atelier-v1"] .voice-plate{order:-1;grid-column:2;margin:0 16px 24px;padding:0;background:none;border:0}
[data-ui="atelier-v1"] .voice-plate .voice{font-size:24px}
[data-ui="atelier-v1"] .qbar{margin-top:0}
[data-ui="atelier-v1"] .ask,[data-ui="atelier-v1"] .exhibit.best,[data-ui="atelier-v1"] .ledger,[data-ui="atelier-v1"] .empty.panel,[data-ui="atelier-v1"] body[data-screen="failed"] .empty.panel{margin-top:24px}
[data-ui="atelier-v1"] .pagehead.panel{margin-top:0}
[data-ui="atelier-v1"] body[data-screen="failed"] main{overflow:visible}
}

/* motion (§5) */
@media (prefers-reduced-motion:no-preference){
[data-ui="atelier-v1"][data-motion] .home .fig,[data-ui="atelier-v1"][data-motion] .home .counter-group,[data-ui="atelier-v1"][data-motion] .home .counter,[data-ui="atelier-v1"][data-motion] .gallery{transition:transform 240ms var(--ease-atelier)}
[data-ui="atelier-v1"][data-motion] body[data-screen="results"] .gallery,[data-ui="atelier-v1"][data-motion] body[data-screen="zero"] .gallery{animation:atelier-arrive 700ms var(--ease-atelier) both}
[data-ui="atelier-v1"][data-motion] .exhibit{transition:transform 160ms var(--ease-atelier)}
[data-ui="atelier-v1"][data-motion] .chip,[data-ui="atelier-v1"][data-motion] .btn-primary,[data-ui="atelier-v1"][data-motion] .btn-secondary,[data-ui="atelier-v1"][data-motion] .search button{transition:transform 80ms var(--ease-atelier)}
[data-ui="atelier-v1"][data-motion] .exhibit:active{transform:scale(.985);transition-duration:80ms}
[data-ui="atelier-v1"][data-motion] .chip:active,[data-ui="atelier-v1"][data-motion] .btn-primary:active,[data-ui="atelier-v1"][data-motion] .btn-secondary:active,[data-ui="atelier-v1"][data-motion] .search button:active{transform:scale(.97)}
}
@media (prefers-reduced-motion:no-preference) and (max-width:767px){
[data-ui="atelier-v1"][data-motion] .home .voice{transition:all 0s 100ms,opacity 240ms linear(0,-999 25%,-999 70.8%,1)}
[data-ui="atelier-v1"][data-motion] .home.compact .voice{opacity:.999;transition-timing-function:linear,linear(0,1000 25%,1000 70.8%,1)}
}
@media (prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine){
[data-ui="atelier-v1"][data-motion] .exhibit:hover{transform:translateY(-4px)}
}
@media (hover:hover) and (pointer:fine){
[data-ui="atelier-v1"] .chip:hover,[data-ui="atelier-v1"] .btn-secondary:hover{border-color:var(--accent)}
}
@supports (animation-timeline:scroll()){
@media (prefers-reduced-motion:no-preference) and (min-height:600px){
[data-ui="atelier-v1"][data-motion] body[data-screen="home"]:not(:has(.compact)) .gallery{animation:atelier-dolly linear both;animation-timeline:scroll(root);animation-range:0 260px}
[data-ui="atelier-v1"][data-motion] body[data-screen="home"]:not(:has(.compact)) .portal{animation:atelier-portal linear both;animation-timeline:scroll(root);animation-range:0 260px}
}
}
@keyframes atelier-arrive{to{transform:translateY(-8px) scale(1.095)}}
@keyframes atelier-dolly{to{transform:translateY(-8px) scale(1.095)}}
@keyframes atelier-portal{to{transform:scale(1.09)}}
