@view-transition{navigation:auto}
:root{--ease-out:cubic-bezier(.22,1,.36,1);--ease-soft:cubic-bezier(.2,.7,.2,1)}
html{scroll-padding-top:84px;overflow-x:clip}
body{isolation:isolate}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:101;background:linear-gradient(110deg,transparent 0 46%,rgba(255,255,255,.06) 49%,transparent 52%);background-size:280% 100%;animation:paper-breathe 18s ease-in-out infinite;mix-blend-mode:soft-light;opacity:.45}
.site-progress{position:fixed;left:0;top:0;z-index:180;width:100%;height:2px;transform-origin:left;transform:scaleX(var(--scroll-progress,0));background:linear-gradient(90deg,var(--red),#e98e77 72%,transparent);pointer-events:none}
.site-coordinate{position:fixed;right:13px;top:50%;z-index:35;transform:translateY(-50%);writing-mode:vertical-rl;color:rgba(92,72,58,.42);font:600 9px/1 var(--mono);letter-spacing:.16em;pointer-events:none}
.topbar{transition:transform .45s var(--ease-out),background .3s ease,box-shadow .3s ease}
.topbar.is-compact{background:color-mix(in srgb,var(--paper) 94%,transparent);box-shadow:0 10px 35px rgba(52,39,29,.045)}
.topbar .name,.topbar nav a{transition:opacity .22s ease,transform .25s var(--ease-out)}
.topbar .name:hover{transform:translateX(2px)}
.home-hero{overflow:clip}
.home-hero::before{content:'AMASE';position:absolute;right:-.045em;top:8%;z-index:-1;color:rgba(74,55,42,.028);font:700 clamp(7rem,21vw,18rem)/.72 var(--serif);letter-spacing:-.1em;writing-mode:vertical-rl;pointer-events:none}
.home-title>*{will-change:transform,opacity}
.home-title .hero-alias{position:relative;display:inline-block}
.home-title .hero-alias::after{content:'';position:absolute;left:calc(100% + 12px);top:50%;width:38px;height:1px;background:var(--red);opacity:.5}
.home-hero h1{transform-origin:left center}
.hero-links a{position:relative;display:inline-block;text-decoration:none;margin-right:20px;padding-bottom:5px}
.hero-links a::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--red);transform:scaleX(.28);transform-origin:left;transition:transform .45s var(--ease-out)}
.hero-links a:hover::after,.hero-links a:focus-visible::after{transform:scaleX(1)}
.desk-note{transform:perspective(900px) rotate(-1.8deg) rotateX(var(--note-rx,0deg)) rotateY(var(--note-ry,0deg)) translate3d(0,var(--note-y,0),0);transition:transform .24s var(--ease-soft),box-shadow .35s ease;will-change:transform}
.desk-note:hover{box-shadow:14px 23px 28px rgba(60,43,31,.13)}
.desk-note::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--note-x,50%) var(--note-yy,45%),rgba(255,255,255,.24),transparent 42%);mix-blend-mode:soft-light}
.status-strip{position:relative}
.status-strip::before{content:'stack';position:absolute;right:0;top:-21px;color:var(--muted);font:500 .52rem/1 var(--mono);letter-spacing:.12em;opacity:.65}
.fresh-main,.fresh-sub,.big-piece,.small-pieces a,.feature-main,.feature-pair a,.demo-list a,.oss-lines a,.catalog-rows a{position:relative;overflow:hidden;transition:transform .34s var(--ease-out),background .28s ease,color .28s ease}
.fresh-main::before,.fresh-sub::before,.feature-main::before,.demo-list a::before,.oss-lines a::before,.catalog-rows a::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(212,79,59,.055),transparent 72%);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease-out)}
.fresh-main:hover::before,.fresh-sub:hover::before,.feature-main:hover::before,.demo-list a:hover::before,.oss-lines a:hover::before,.catalog-rows a:hover::before{transform:scaleX(1)}
.feature-main:hover,.fresh-main:hover,.big-piece:hover{transform:translateX(5px)}
.small-pieces a:hover,.feature-pair a:hover{transform:translateY(-4px)}
.chapter h2,.catalog-block h2{text-wrap:balance}
.catalog-intro h1{position:relative}
.catalog-intro h1::after{content:'';position:absolute;left:.04em;bottom:-.08em;width:.7em;height:3px;background:linear-gradient(90deg,var(--red),transparent);transform:rotate(-1.5deg)}
.catalog-block{content-visibility:auto;contain-intrinsic-size:720px}
.catalog-block>header>span{transition:background .25s ease,color .25s ease,transform .35s var(--ease-out)}
.catalog-block:hover>header>span{background:var(--red);color:var(--paper2);transform:rotate(0deg)}
.catalog-rows a>strong{transition:letter-spacing .35s var(--ease-out)}
.catalog-rows a:hover>strong{letter-spacing:.012em}
.work-index{position:sticky;top:71px;z-index:28;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.work-index a{transition:color .2s ease,background .2s ease}
.work-index a:hover,.work-index a.is-current{color:var(--red2);background:rgba(255,250,242,.44)}
[data-reveal]{opacity:0;transform:translateY(24px)}
[data-reveal].is-visible{opacity:1;transform:none;transition:opacity .85s var(--ease-out),transform .85s var(--ease-out)}
[data-reveal='fast'].is-visible{transition-duration:.58s}
[data-reveal-delay='1'].is-visible{transition-delay:.06s}[data-reveal-delay='2'].is-visible{transition-delay:.12s}[data-reveal-delay='3'].is-visible{transition-delay:.18s}
::view-transition-old(root){animation:page-out .26s ease both}::view-transition-new(root){animation:page-in .48s var(--ease-out) both}
a:focus-visible,button:focus-visible,textarea:focus-visible{outline:2px solid color-mix(in srgb,var(--red) 80%,#fff);outline-offset:4px;border-radius:2px}
@keyframes page-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes page-out{to{opacity:0;transform:translateY(-4px)}}@keyframes paper-breathe{0%,100%{background-position:0 0}50%{background-position:100% 0}}
@media(max-width:720px){.site-coordinate{display:none}.home-hero::before{font-size:10rem;right:-.18em;top:22%;opacity:.55}.work-index{top:58px}.topbar nav.nav-away{transform:translate(-50%,120px)!important}.topbar nav{transition:transform .42s var(--ease-out),opacity .3s ease}.catalog-block{contain-intrinsic-size:980px}.fresh-main:hover,.big-piece:hover,.feature-main:hover{transform:none}}
@media(max-width:560px){body{padding-bottom:86px}.topbar{padding-top:max(14px,env(safe-area-inset-top))}.topbar nav{bottom:max(14px,env(safe-area-inset-bottom))!important;box-shadow:0 12px 35px rgba(44,32,23,.18),inset 0 1px rgba(255,255,255,.38)}.work-index{position:relative;top:auto;backdrop-filter:none}.home-title .hero-alias::after{width:26px}.desk-note{transform:rotate(-1.25deg)}.status-strip::before{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.desk-note{transform:rotate(-1deg)}[data-reveal]{opacity:1!important;transform:none!important}}


/* Notes: a sheet pulled from the same desk, not a separate blog theme. */
body[data-page='note'],body[data-page='missing']{
  --paper:#f3ecdf;--paper2:#fbf6ed;--ink:#1b1714;--muted:#756a60;--line:#cbbdae;--red:#d44f3b;--red2:#a93828;
  --serif:'Hiragino Mincho ProN','Yu Mincho','YuMincho','Noto Serif JP',serif;--sans:ui-sans-serif,system-ui,-apple-system,'Noto Sans JP','Yu Gothic UI',sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  min-height:100vh;color:var(--ink);font-family:var(--sans);background:
  radial-gradient(circle at 14% 9%,rgba(255,255,255,.28),transparent 28%),
  linear-gradient(90deg,rgba(88,68,51,.018) 1px,transparent 1px),
  linear-gradient(rgba(88,68,51,.014) 1px,transparent 1px),#ddd4c8;background-size:auto,23px 23px,23px 23px,auto
}
body[data-page='note'] .wrap,body[data-page='missing'] .wrap{max-width:1040px;padding:64px 20px 112px}
body[data-page='note'] .paper,body[data-page='missing'] .paper{position:relative;overflow:visible;padding:clamp(38px,7vw,82px);border:1px solid rgba(82,61,46,.14);border-radius:1px;background:
  linear-gradient(rgba(92,68,52,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(212,79,59,.018),transparent 34%),var(--paper2);background-size:100% 30px,100% 100%,auto;box-shadow:0 34px 90px rgba(53,39,29,.18),0 2px 8px rgba(53,39,29,.07)}
body[data-page='note'] .paper::before,body[data-page='missing'] .paper::before{content:'';position:absolute;left:11%;top:-12px;width:92px;height:24px;background:rgba(226,207,157,.63);box-shadow:0 1px 2px rgba(67,50,38,.08);transform:rotate(-2deg)}
body[data-page='note'] .paper::after{content:'FIELD NOTE';position:absolute;right:-29px;top:115px;writing-mode:vertical-rl;color:rgba(91,72,58,.42);font:600 9px/1 var(--mono);letter-spacing:.18em}
body[data-page='note'] .nav,body[data-page='missing'] .nav{align-items:center;margin:0 0 62px;padding:0 0 18px;border-bottom:1px solid rgba(55,42,32,.38)}
body[data-page='note'] .nav .brand,body[data-page='missing'] .nav .brand{position:relative;margin-right:auto;color:var(--ink);font:700 1rem/1 var(--serif);letter-spacing:-.02em}
body[data-page='note'] .nav .brand::before,body[data-page='missing'] .nav .brand::before{content:'✦';position:absolute;left:-20px;top:-3px;color:var(--red);font:400 11px/1 var(--sans)}
body[data-page='note'] .nav a,body[data-page='missing'] .nav a{color:var(--muted);font-size:.78rem}
body[data-page='note'] .nav a:hover,body[data-page='missing'] .nav a:hover{color:var(--red2)}
body[data-page='note'] .meta,body[data-page='missing'] .meta{margin:0 0 25px;color:var(--red2);font:700 .65rem/1.4 var(--mono);letter-spacing:.055em}
body[data-page='note'] .paper h1,body[data-page='missing'] .paper h1{max-width:820px;margin:.08em 0 .5em;color:var(--ink);font:600 clamp(2.8rem,6.6vw,5.7rem)/1.03 var(--serif);letter-spacing:-.055em;text-wrap:balance}
body[data-page='note'] .paper h1::after,body[data-page='missing'] .paper h1::after{content:'';display:block;width:92px;height:3px;margin-top:24px;background:linear-gradient(90deg,var(--red),transparent);transform:rotate(-1deg)}
body[data-page='note'] .lede,body[data-page='missing'] .lede{max-width:760px;color:#544b44;font-size:1rem;line-height:2}
body[data-page='note'] .paper h2,body[data-page='missing'] .paper h2{margin-top:2.25em;color:var(--ink);font:600 clamp(1.45rem,2.5vw,2rem)/1.4 var(--serif);letter-spacing:-.025em}
body[data-page='note'] .paper p,body[data-page='missing'] .paper p{max-width:780px;line-height:2}
body[data-page='note'] code,body[data-page='missing'] code{padding:.1em .34em;border-radius:1px;background:#e8dece;color:#352c26;font-family:var(--mono);font-size:.88em}
body[data-page='note'] .rule,body[data-page='missing'] .rule{height:1px;margin:44px 0;background:linear-gradient(90deg,var(--ink),var(--line) 45%,transparent)}
body[data-page='note'] .paper footer,body[data-page='missing'] .paper footer{margin-top:74px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font:500 .7rem/1.6 var(--mono)}
body[data-page='missing'] .paper{min-height:70vh}body[data-page='missing'] .paper::after{content:'404';position:absolute;right:5%;bottom:5%;z-index:-1;color:rgba(77,58,44,.045);font:700 clamp(8rem,24vw,17rem)/.8 var(--serif)}
body[data-page='missing'] .card{padding:18px 0;border-top:1px solid var(--line)}body[data-page='missing'] .card a{font-family:var(--serif);font-size:1.15rem}body[data-page='missing'] .card p{margin:.45em 0;color:var(--muted);font-size:.82rem}
@media(max-width:620px){body[data-page='note'] .wrap,body[data-page='missing'] .wrap{padding:32px 10px 90px}body[data-page='note'] .paper,body[data-page='missing'] .paper{padding:42px 24px 58px;box-shadow:0 22px 55px rgba(53,39,29,.16)}body[data-page='note'] .paper::after{display:none}body[data-page='note'] .nav,body[data-page='missing'] .nav{gap:12px;margin-bottom:44px}.site-progress{height:2px}}

/* The interactive process page gets a real visual spine. */
.flow-list{position:relative}.flow-list::before{content:'';position:absolute;left:35px;top:28px;bottom:28px;width:1px;background:linear-gradient(var(--red),var(--line) 28%,var(--line) 72%,transparent);opacity:.38;pointer-events:none}.flow-row{position:relative}.flow-row .n{position:relative;z-index:1}.flow-row.active .n{color:var(--red2)}.flow-row.active{transform:translateX(4px)}.flow-intro .keep{white-space:nowrap}
@media(max-width:700px){.flow-list::before{left:21px}.flow-intro h1{font-size:clamp(3.1rem,15vw,5.4rem)!important}}

body[data-page='missing'] [data-reveal]{opacity:1!important;transform:none!important}

.shelf-preview{position:fixed;left:0;top:0;z-index:170;width:300px;min-height:150px;padding:25px 25px 22px;border:1px solid #dccd88;background:#fff6c9;box-shadow:12px 16px 0 rgba(67,50,38,.09),0 18px 46px rgba(67,50,38,.13);opacity:0;pointer-events:none;transform:translate3d(var(--preview-x,0),var(--preview-y,0),0) rotate(.8deg) scale(.96);transform-origin:center;transition:opacity .18s ease,transform .34s var(--ease-out)}
.shelf-preview.is-on{opacity:1;transform:translate3d(var(--preview-x,0),var(--preview-y,0),0) rotate(-.7deg) scale(1)}
.shelf-preview::before{content:'';position:absolute;left:94px;top:-10px;width:82px;height:20px;background:rgba(224,207,160,.62);transform:rotate(-2deg)}
.shelf-preview small{display:block;margin-bottom:17px;color:var(--red2);font:700 .59rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.shelf-preview strong{display:block;margin-bottom:18px;font:600 1.35rem/1.2 var(--serif);letter-spacing:-.025em}
.shelf-preview code{display:block;padding:13px 0 0;border-top:1px solid rgba(78,60,46,.22);background:none;color:#5c4f45;font:600 .72rem/1.7 var(--mono);white-space:normal}
@media(max-width:899px),(pointer:coarse){.shelf-preview{display:none}}