/* The shared chrome of every stamped site (factory core): tokens only (public/look.css defines them, _looks makes the tokens). No colour,
   font or radius is written here. A frame or a page may not touch these classes' colours either. */
:root{--t-head-h:60px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--s0);color:var(--ink1);font:400 15px/1.55 var(--f-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
a{color:inherit}img{max-width:100%;display:block}button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--acc);color:var(--on-acc)}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.is-hidden{display:none!important}
@keyframes f-rise{from{opacity:0;transform:translateY(12px)}}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.t-head{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--s0) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line1)}
.t-head-in{max-width:var(--page-max,1320px);margin:0 auto;padding:0 clamp(16px,3vw,32px);height:var(--t-head-h);display:flex;align-items:center;gap:clamp(12px,2vw,28px)}
.t-brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.t-logo{width:28px;height:28px;border-radius:var(--r1);object-fit:cover;flex:none}
.t-name{font:600 15px/1 var(--f-display);letter-spacing:-.01em;white-space:nowrap}
.t-tick{font:500 11px/1 var(--f-mono);letter-spacing:.06em;color:var(--ink3);text-transform:uppercase;white-space:nowrap}
.t-nav{display:flex;align-items:center;gap:clamp(12px,1.6vw,22px);margin-left:6px;font:500 13px/1 var(--f-body);color:var(--ink2)}
.t-nav a{text-decoration:none;white-space:nowrap}.t-nav a:hover{color:var(--ink1)}
.t-right{margin-left:auto;display:flex;align-items:center;gap:10px;min-width:0}
.t-ca{display:flex;align-items:center;gap:6px;min-width:0}
.t-ca-btn{display:flex;align-items:center;gap:8px;height:34px;padding:0 6px 0 12px;background:var(--s2);border:1px solid var(--line2);border-radius:var(--r1);cursor:copy;font:500 12px/1 var(--f-mono);min-width:0}
.t-ca-btn:hover{border-color:var(--acc)}
.t-ca-k{color:var(--ink3);letter-spacing:.06em}
.t-ca-v{white-space:nowrap}
.t-ca-copy{font-style:normal;font:600 11px/1 var(--f-body);background:var(--acc);color:var(--on-acc);padding:5px 8px;border-radius:var(--r0)}
.t-ca-link{font:500 12px/1 var(--f-body);color:var(--ink2);text-decoration:none;white-space:nowrap;padding:0 4px}
.t-ca-link:not([href]){display:none}
.t-ca-link:hover{color:var(--ink1)}
.t-x{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line2);border-radius:var(--r1);color:var(--ink1);flex:none}
.t-x:hover{border-color:var(--acc);color:var(--acc)}
.t-foot{border-top:1px solid var(--line1);margin-top:clamp(40px,7vw,96px)}
.t-foot-in{max-width:var(--page-max,1320px);margin:0 auto;padding:22px clamp(16px,3vw,32px);display:flex;align-items:center;gap:18px;font-size:13px;color:var(--ink3)}
.t-foot-line{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t-nfa{white-space:nowrap;font-size:12px}
@media (max-width:760px){.t-nav{display:none}.t-ca-link{display:none}.t-tick{display:none}.t-foot-in{flex-wrap:wrap}.t-foot-line{order:3;flex-basis:100%;white-space:normal}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
