:root{--paper:#f4efe4;--paper-light:#fffdf6;--ink:#1e3b34;--ink-soft:#46625a;--muted:#7c8877;--gold:#c8964a;--gold-pale:#e5d6b8;--wine:#d8603c;--vermilion:#e8734a;--moss:#5a7d6b;--line:rgba(30,59,52,.22);--fiber:rgba(30,59,52,.045);--ease:cubic-bezier(.16,1,.3,1);--shadow:0 4px 12px rgba(46,59,48,.08),0 24px 50px rgba(46,59,48,.12);--shadow-rich:0 10px 20px rgba(46,59,48,.10),0 36px 72px rgba(46,59,48,.18)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0;background:var(--paper);color:var(--ink);font-family:"DM Mono",monospace;overflow-x:hidden;position:relative}.bg-photo{position:fixed;inset:0;z-index:-2;background-image:url('assets/hero-bg.jpg');background-size:cover;background-position:center;pointer-events:none}.bg-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(244,239,228,.5),rgba(244,239,228,.62))}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,textarea:focus-visible,.agent-card:focus-visible{outline:2px solid var(--gold);outline-offset:4px}::selection{background:var(--wine);color:var(--paper-light)}.studio-shell{width:min(1380px,calc(100% - 52px));margin:auto;padding:30px 0 96px}
.masthead{display:grid;grid-template-columns:1fr 1.5fr auto;gap:28px;align-items:end;padding-bottom:22px;border-bottom:1px solid var(--gold)}.wordmark{display:grid;grid-template-columns:auto auto 1fr;column-gap:2px;align-items:baseline;color:inherit;text-decoration:none;font:600 35px/1 "Noto Serif SC",serif;letter-spacing:.055em}.wordmark strong{color:var(--wine)}.wordmark i{margin-left:9px;color:var(--gold);font:500 8px/1.35 "DM Mono",monospace;letter-spacing:.18em}.masthead-note{max-width:38ch;margin:0;color:var(--muted);font:400 14px/1.75 "Noto Serif SC",serif}.issue-stamp{display:grid;gap:6px;color:var(--muted);font-size:9px;letter-spacing:.12em;text-align:right}.issue-stamp time{color:var(--wine)}
.opening{position:relative;display:grid;grid-template-columns:1.5fr .8fr;gap:70px;align-items:end;padding:96px 0 80px;overflow:hidden}.opening::before{position:absolute;z-index:-1;right:-4%;top:-18%;color:rgba(30,59,52,.05);font:600 42vw/1 "Bodoni Moda",serif;font-style:italic;letter-spacing:-.06em;content:"BIRO";pointer-events:none}.opening h1{max-width:9ch;margin:0;font:600 clamp(54px,8.5vw,148px)/.96 "Noto Serif SC",serif;letter-spacing:-.045em}.opening h1 span{display:block;overflow:hidden}.opening h1 span>*{display:inline-block}.opening h1 em{padding:0 .04em .12em;color:var(--wine);font-family:"Bodoni Moda","Noto Serif SC",serif;font-style:italic;font-weight:500;line-height:1.08}.opening p{max-width:43ch;margin:32px 0 0;color:var(--muted);font:400 16px/1.95 "Noto Serif SC",serif}.process-note{align-self:center;padding:24px 0 6px;border-top:1px solid var(--gold);border-bottom:1px solid var(--gold)}.process-note svg{width:100%;height:72px;overflow:visible;fill:none;stroke:var(--gold);stroke-width:1.25}.process-note circle{fill:var(--paper);stroke:var(--wine)}.process-note ol{display:flex;justify-content:space-between;padding:0;margin:6px 0 15px;list-style:none;color:var(--ink-soft);font-size:10px}.process-note small{color:var(--muted);font-size:8px;letter-spacing:.05em}
.section-line{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-top:11px;border-top:1px solid var(--gold)}.section-line h2,.sheet-head h2{margin:0;font:600 21px "Noto Serif SC",serif;letter-spacing:.035em}.section-line>span,.sheet-label{color:var(--gold);font-size:9px;letter-spacing:.18em}.agent-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:24px}.agent-card{position:relative;min-height:320px;padding:19px;border:1px solid var(--gold-pale);border-radius:14px;background:linear-gradient(150deg,rgba(255,253,246,.9),rgba(244,239,228,.65));text-align:left;overflow:hidden;isolation:isolate;box-shadow:var(--shadow);transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .3s var(--ease),background .4s var(--ease)}.agent-card::before{position:absolute;right:12px;bottom:0;z-index:-1;color:var(--agent);font:500 132px/.78 "Bodoni Moda",serif;opacity:.16;content:attr(data-number);transition:transform .6s var(--ease),opacity .4s var(--ease)}.agent-card::after{position:absolute;inset:-30% -50%;z-index:-1;background:linear-gradient(112deg,transparent 42%,rgba(255,255,255,.75) 50%,transparent 58%);content:"";opacity:0;transform:translateX(-65%) rotate(8deg);transition:transform .9s var(--ease),opacity .25s ease}.agent-card:hover,.agent-card[aria-checked="true"]{background:linear-gradient(rgba(244,239,228,.62),rgba(244,239,228,.82)),var(--agent-img) center/cover no-repeat;border-color:rgba(200,150,74,.65);box-shadow:var(--shadow-rich);transform:translateY(-5px)}.agent-card:hover::before,.agent-card[aria-checked="true"]::before{opacity:.9;transform:translateY(-10px) rotate(-5deg)}.agent-card:hover::after{opacity:.5;transform:translateX(74%) rotate(8deg)}.agent-card .kind{color:var(--agent);font-size:9px;letter-spacing:.16em}.agent-card h3{position:relative;z-index:1;max-width:6em;margin:58px 0 13px;font:600 27px/1.15 "Noto Serif SC",serif}.agent-card p{position:relative;z-index:1;max-width:18ch;margin:0;color:var(--muted);font:400 11px/1.75 "Noto Serif SC",serif}.agent-card:hover p,.agent-card[aria-checked="true"] p{color:var(--ink-soft)}.agent-arrow{position:absolute;right:18px;bottom:19px;color:var(--agent);font:500 22px "Bodoni Moda",serif}
.production-sheet{position:relative;margin-top:78px;border:1px solid var(--gold);background:var(--paper-light);box-shadow:var(--shadow);overflow:hidden}.production-sheet::before{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(rgba(30,59,52,.035) .6px,transparent .75px),radial-gradient(480px 300px at 100% 0%,rgba(216,96,60,.07),transparent 60%);background-size:6px 6px,100% 100%;content:""}.sheet-head,.sheet-body,.sheet-footer{position:relative;z-index:1}.sheet-head{display:flex;align-items:end;justify-content:space-between;padding:25px 29px 21px;border-bottom:1px solid var(--gold-pale)}.sheet-label{display:block;margin-bottom:8px;color:var(--wine)}.agent-code{color:var(--gold);font-size:9px;letter-spacing:.15em}.sheet-body{display:grid;grid-template-columns:.9fr 1.35fr}.upload-column{padding:28px;border-right:1px solid var(--gold-pale)}.dropzone{position:relative;display:flex;min-height:218px;flex-direction:column;align-items:center;justify-content:center;border:1px dashed rgba(200,150,74,.7);border-radius:10px;background:rgba(244,239,228,.5);text-align:center;overflow:hidden;transition:border-color .3s var(--ease),background .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)}.dropzone::after{position:absolute;right:14px;top:12px;color:var(--gold);font-size:7px;letter-spacing:.18em;content:"DROP TO PLACE";opacity:0;transform:translateY(-5px);transition:.25s var(--ease)}.dropzone:hover,.dropzone.is-dragging{border-color:var(--wine);background:rgba(216,96,60,.08);box-shadow:inset 0 0 0 1px rgba(216,96,60,.2)}.dropzone.is-dragging{transform:scale(.987)}.dropzone.is-dragging::after{opacity:1;transform:none}.dropzone svg{width:43px;fill:none;stroke:var(--wine);stroke-width:1.3}.dropzone strong{margin-top:14px;font:600 16px "Noto Serif SC",serif}.dropzone span{max-width:22ch;margin-top:8px;color:var(--muted);font-size:9px;line-height:1.65}.image-strip{display:flex;gap:9px;min-height:0;margin-top:13px;overflow:auto}.upload-thumb{position:relative;flex:0 0 62px;height:62px;border:1px solid var(--gold-pale);border-radius:9px;background:var(--paper);overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.5);animation:thumb-in .36s var(--ease) both}.upload-thumb img{width:100%;height:100%;object-fit:cover}.upload-thumb button{position:absolute;right:3px;top:3px;width:20px;height:20px;border:1px solid var(--gold-pale);border-radius:50%;background:var(--vermilion);color:white;line-height:1}.brief-column{padding:28px}.brief-column>label,.delivery-options>span{display:block;margin-bottom:13px;color:var(--ink-soft);font-size:10px;letter-spacing:.08em}.brief-column textarea{width:100%;min-height:124px;padding:12px;border:1px solid transparent;border-bottom-color:var(--gold-pale);border-radius:10px 10px 0 0;resize:vertical;background:rgba(244,239,228,.4);color:var(--ink);font:400 21px/1.58 "Noto Serif SC",serif;outline:none;transition:background .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease)}.brief-column textarea:focus{border-color:rgba(200,150,74,.55);background:rgba(255,253,246,.9);box-shadow:0 0 0 4px rgba(200,150,74,.12)}.brief-column textarea::placeholder{color:rgba(30,59,52,.32)}.field-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;color:var(--muted);font-size:9px}.example-button,.history-button{border:0;border-radius:999px;background:transparent;color:var(--gold);font-size:9px;text-decoration:underline;text-decoration-color:rgba(176,141,79,.55);text-underline-offset:4px}.example-button:hover,.history-button:hover{color:var(--wine)}.delivery-options{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:30px}.delivery-options>span{margin:0}.ratio-options{display:flex;gap:7px}.ratio-option{min-width:45px;min-height:35px;border:1px solid var(--gold-pale);border-radius:8px;background:transparent;color:var(--muted);font-size:9px;transition:.22s var(--ease)}.ratio-option:hover{border-color:var(--gold);color:var(--ink);transform:translateY(-1px)}.ratio-option.is-active{border-color:var(--gold);background:linear-gradient(135deg,#1c2922,#343124);color:var(--paper-light);box-shadow:0 4px 10px rgba(30,38,29,.18)}.sheet-footer{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:18px 29px;border-top:1px solid var(--gold-pale)}.sheet-footer p{max-width:55ch;margin:0;color:var(--muted);font:400 11px/1.65 "Noto Serif SC",serif}.make-button{position:relative;display:inline-flex;align-items:center;gap:29px;min-width:168px;justify-content:space-between;overflow:hidden;padding:14px 17px;border:1px solid rgba(216,96,60,.5);border-radius:9px;background:linear-gradient(135deg,#1e3b34,#2a4d42);box-shadow:0 6px 16px rgba(30,59,52,.22);color:#fbf4e6;font-size:10px;letter-spacing:.035em;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease)}.make-button::before{position:absolute;inset:0;background:linear-gradient(112deg,transparent 33%,rgba(255,255,255,.16) 49%,transparent 64%);content:"";transform:translateX(-130%)}.make-button:hover{border-color:var(--wine);box-shadow:0 12px 26px rgba(30,59,52,.3);transform:translateY(-2px)}.make-button:hover::before,.make-button.is-making::before{animation:button-glint .85s var(--ease) both}.make-button:active{transform:translateY(0) scale(.985)}.make-button:disabled{opacity:.65;cursor:wait}.make-button svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.5}.make-button.is-making svg{animation:arrow-shift .8s ease-in-out infinite}
.making-state{display:grid;grid-template-columns:104px 1fr auto;gap:27px;align-items:center;margin-top:76px;padding:27px 0;border-top:1px solid var(--gold);border-bottom:1px solid var(--gold)}.folio-loader{position:relative;width:86px;height:68px;perspective:400px}.folio-loader i{position:absolute;left:18px;top:8px;width:48px;height:56px;border:1px solid var(--gold);border-radius:2px;background:linear-gradient(135deg,#fffdf8,#e8e1d1);box-shadow:4px 5px 12px rgba(57,42,21,.12);transform-origin:left center;animation:folio-turn 1.9s var(--ease) infinite}.folio-loader i:nth-child(2){left:22px;top:5px;border-color:var(--wine);animation-delay:.3s}.folio-loader i:nth-child(3){left:26px;top:2px;border-color:var(--gold);animation-delay:.6s}.making-state span{color:var(--wine);font-size:9px;letter-spacing:.13em}.making-state strong{display:block;margin-top:6px;font:600 20px "Noto Serif SC",serif}.making-state p{margin:6px 0 0;color:var(--muted);font:400 11px/1.65 "Noto Serif SC",serif}.making-state button{border:0;background:none;color:var(--muted);font-size:9px;text-decoration:underline;text-underline-offset:4px}.gallery-section{margin-top:78px}.history-button span{display:inline-grid;place-items:center;width:18px;height:18px;margin-left:4px;border-radius:50%;background:var(--wine);color:white;text-decoration:none}.gallery-empty{display:grid;place-items:center;min-height:265px;margin-top:22px;border-bottom:1px solid var(--gold-pale);text-align:center}.gallery-empty span{color:var(--wine);font:500 32px "Bodoni Moda",serif;font-style:italic}.gallery-empty p{color:var(--muted);font:400 12px/1.9 "Noto Serif SC",serif}.result-gallery{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:17px;margin-top:22px}.result-card{position:relative;overflow:hidden;border:1px solid var(--gold-pale);border-radius:14px;background:var(--paper-light);box-shadow:var(--shadow);animation:photo-develop .64s var(--ease) both;transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .3s var(--ease)}.result-card:nth-child(2){animation-delay:.1s}.result-card:nth-child(3){animation-delay:.2s}.result-card:first-child{transform:translateY(-12px)}.result-card::after{position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 48%,transparent 62%);content:"";transform:translateX(-130%)}.result-card:hover{border-color:var(--gold);box-shadow:var(--shadow-rich);transform:translateY(-6px)}.result-card:first-child:hover{transform:translateY(-17px)}.result-card:hover::after{animation:photo-glint 1s var(--ease) both}.result-card img{display:block;width:100%;aspect-ratio:1;object-fit:cover;cursor:zoom-in;transition:transform .7s var(--ease),filter .45s var(--ease)}.result-card:first-child img{aspect-ratio:4/5}.result-card:hover img{filter:contrast(1.04) saturate(.94);transform:scale(1.032)}.result-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;color:var(--muted);font-size:9px}.result-meta button{border:0;border-radius:6px;background:none;color:var(--ink);font-size:9px;transition:color .2s var(--ease),background .2s var(--ease)}.result-meta button:hover{background:rgba(176,141,79,.11);color:var(--wine)}
.image-dialog{width:min(92vw,960px);padding:0;border:0;background:transparent;color:var(--paper-light)}.image-dialog::backdrop{background:rgba(13,20,16,.91);backdrop-filter:blur(4px)}.image-dialog img{display:block;max-width:100%;max-height:78vh;margin:auto;box-shadow:0 25px 80px rgba(0,0,0,.4)}.image-dialog p{margin:12px 0 0;font:400 12px/1.6 "Noto Serif SC",serif;text-align:center}.dialog-close{position:fixed;right:22px;top:18px;width:42px;height:42px;border:1px solid rgba(225,201,142,.7);border-radius:50%;background:rgba(22,33,27,.5);color:white;font-size:28px}.toast{position:fixed;left:50%;bottom:24px;z-index:4;transform:translate(-50%,16px);padding:11px 15px;border:1px solid var(--gold);border-radius:8px;background:#19241d;color:var(--paper-light);font-size:10px;opacity:0;pointer-events:none;transition:.25s var(--ease)}.toast.is-visible{transform:translate(-50%,0);opacity:1}.is-hidden{display:none!important}
@keyframes folio-turn{0%,14%{opacity:.1;transform:rotateY(0) scale(.92)}42%{opacity:.98;transform:rotateY(-46deg) scale(1)}64%{opacity:.72;transform:rotateY(-89deg) scale(1.02)}100%{opacity:.08;transform:rotateY(-89deg) scale(.94)}}@keyframes photo-develop{from{opacity:0;transform:translateY(16px) scale(.96);filter:blur(5px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes photo-glint{to{transform:translateX(132%)}}@keyframes button-glint{to{transform:translateX(130%)}}@keyframes arrow-shift{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}@keyframes thumb-in{from{opacity:0;transform:scale(.88) rotate(-3deg)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){.masthead{animation:soft-in .6s var(--ease) both}.opening h1 span{animation:title-in .65s var(--ease) both}.opening h1 span:nth-child(2){animation-delay:.055s}.opening h1 span:nth-child(3){animation-delay:.11s}.opening p{animation:soft-in .7s var(--ease) .18s both}.agent-card{animation:card-in .7s var(--ease) both}.agent-card:nth-child(2){animation-delay:.07s}.agent-card:nth-child(3){animation-delay:.14s}.agent-card:nth-child(4){animation-delay:.21s}.agent-card:nth-child(5){animation-delay:.28s}[data-reveal]{will-change:transform,opacity,filter}[data-reveal].is-visible{animation:reveal-finish .68s var(--ease) both}.agent-section .section-line{animation:soft-in .65s var(--ease) .22s both}@keyframes soft-in{from{opacity:0;transform:translateY(10px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}@keyframes title-in{from{transform:translateY(105%);filter:blur(7px)}to{transform:none;filter:none}}@keyframes card-in{from{opacity:0;transform:translateY(22px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}@keyframes reveal-finish{from{opacity:.58;transform:translateY(13px);filter:blur(2px)}to{opacity:1;transform:none;filter:none}}}
@media(max-width:900px){.masthead{grid-template-columns:1fr auto}.masthead-note{display:none}.opening{grid-template-columns:1fr .7fr;gap:38px}.agent-grid{grid-template-columns:repeat(2,1fr)}.sheet-body{grid-template-columns:1fr}.upload-column{border-right:0;border-bottom:1px solid var(--gold-pale)}.result-gallery{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.studio-shell{width:min(100% - 30px,1380px);padding:18px 0 70px}.masthead{padding-bottom:16px}.wordmark{font-size:27px}.wordmark i{display:none}.issue-stamp{font-size:8px}.opening{grid-template-columns:1fr;padding:52px 0 46px}.opening h1{font-size:51px}.process-note{max-width:330px}.agent-grid{grid-template-columns:1fr 1fr;gap:2px}.agent-card{min-height:220px;border-radius:10px;padding:14px}.agent-card h3{margin-top:37px;font-size:20px}.agent-card p{font-size:10px}.agent-card::before{font-size:76px}.production-sheet{margin-top:54px}.sheet-head,.sheet-footer{padding:18px}.sheet-head h2{font-size:17px}.agent-code{font-size:7px}.upload-column,.brief-column{padding:18px}.dropzone{min-height:182px}.brief-column textarea{font-size:18px}.delivery-options{display:block}.ratio-options{margin-top:10px}.sheet-footer{align-items:flex-start;flex-direction:column;gap:15px}.make-button{width:100%}.making-state{grid-template-columns:66px 1fr;gap:15px;margin-top:54px}.folio-loader{width:58px;height:56px;transform:scale(.7);transform-origin:left center}.making-state button{grid-column:2}.gallery-section{margin-top:58px}.result-gallery{grid-template-columns:1fr}.result-card:first-child{transform:none}.result-card:first-child img{aspect-ratio:1}.result-card:hover,.result-card:first-child:hover{transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.production-sheet,.gallery-section,[data-reveal]{opacity:1!important;transform:none!important;filter:none!important}}