@font-face{font-family:Montserrat;src:url('/montserrat.woff2') format('woff2');font-display:swap}
@font-face{font-family:Cormorant;src:url('/cormorant.woff2') format('woff2');font-display:swap}
:root{--paper:#f7f5ee;--white:#fffefa;--ink:#263c34;--muted:#6d776c;--green:#185d4b;--pale:#e5ede2;--line:#dce1d6;--gold:#a0824b;--warm:#eee6d7;--red:#a15d4a;--amber:#8a6a1f}
*{box-sizing:border-box}
html,body{height:100%;margin:0;overscroll-behavior:none}
body{background:#e8e8df;color:var(--ink);font:15px/1.4 Montserrat,-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif;-webkit-text-size-adjust:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
button:disabled{opacity:.45;cursor:default}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.app{height:100vh;height:100dvh;max-width:560px;margin:0 auto;display:flex;flex-direction:column;background:var(--paper);overflow:hidden}
@media(min-width:600px){.app{box-shadow:0 0 0 1px #d2d8cc,0 18px 50px #253d2c14}}
.nav{flex-shrink:0;height:calc(48px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 16px 0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.wordmark{font-family:Cormorant,Georgia,serif;font-size:24px;font-weight:600;display:flex;align-items:center;gap:7px}
.wordmark img{width:22px;height:22px}
.who{font-size:12px;color:var(--muted)}
.view{flex:1;min-height:0;display:flex;flex-direction:column}
.view.pad{padding:0 18px 18px}
.view.scroll{display:block;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.headline{font-family:Cormorant,Georgia,serif;font-size:32px;line-height:1.05;font-weight:500;margin:4px 0 8px}
.headline.small{font-size:25px}
.eyeline{font-size:11px;letter-spacing:.3px;color:var(--muted);margin:14px 0 4px;text-transform:uppercase}
.muted{color:var(--muted);font-size:13px}
.err{color:var(--red);font-size:13px;min-height:1em}
.empty-note{padding:24px;border:1px dashed var(--line);border-radius:14px;text-align:center;color:var(--muted);font-size:14px}
.cta{width:100%;min-height:48px;padding:11px 16px;border:1px solid var(--green);border-radius:14px;background:var(--green);color:#fff;font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px}
.cta.secondary{background:var(--white);color:var(--green);border-color:#cdd8c7}
.link{border:0;background:none;color:var(--green);font-weight:600;text-decoration:underline;text-underline-offset:3px;padding:6px 4px;min-height:36px}
.chip{border:1px solid #cdd8c7;background:var(--white);color:var(--green);border-radius:999px;padding:7px 12px;font-size:12px;margin:3px 4px 3px 0;min-height:36px}
.chip.on{background:var(--green);color:#fff;border-color:var(--green)}
label{display:block;font-size:12px;color:var(--muted);margin-top:10px}
input:not([type=file]):not([type=range]),select,textarea{display:block;width:100%;margin-top:4px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--white);font-size:16px}
input[type=range]{width:100%}
.row{display:flex;gap:8px}.row>*{flex:1;min-width:0}
.login{max-width:360px;margin:12vh auto 0}

/* Review: the sheet takes every pixel the header and action bar leave. */
.view.review{padding:0 10px}
.sheet-head{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:8px 0 6px}
.sheet-title{flex:1;min-width:0;text-align:center;display:flex;flex-direction:column}
.sheet-title b{font-family:Cormorant,Georgia,serif;font-size:20px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheet-title span{font-size:11px;color:var(--muted)}
.nav-arrow{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--white);font-size:22px;line-height:1;color:var(--green)}
.hint{flex-shrink:0;font-size:12px;color:var(--amber);text-align:center;margin:0 0 6px}
.stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none}
.sheet-box{position:relative;border-radius:6px;overflow:hidden;box-shadow:0 2px 14px #253d2c1f;background:var(--white)}
.sheet-box img{display:block;width:100%;height:100%;pointer-events:none;-webkit-touch-callout:none}
.cell{position:absolute;border:0;background:transparent;padding:0;border-radius:6px;-webkit-touch-callout:none}
.cell .tag{position:absolute;right:4px;top:4px;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:#fffefaE6;color:var(--ink);font-size:11px;font-weight:700;display:none;align-items:center;justify-content:center;box-shadow:0 1px 3px #0002}
.unprinted .cell .tag{display:flex}
.cell.on{box-shadow:inset 0 0 0 3px var(--green);background:#185d4b14}
.cell.on .tag{display:flex;background:var(--green);color:#fff}
.cell.on .tag::before{content:'✓ ';margin-right:2px}
.cell.preview{box-shadow:inset 0 0 0 1px #a0824bcc;pointer-events:none}
.cell.preview .tag{display:flex;background:var(--gold);color:#fff}
.done{margin:auto 0}

/* Large-piece review preserves collection context without squeezing every cell onto one screen. */
.review-modes{display:flex;gap:4px;flex-shrink:0;background:var(--pale);border-radius:10px;padding:3px;margin:3px 4px 0}
.review-modes button{flex:1;border:0;border-radius:8px;background:transparent;color:var(--muted);min-height:38px;font-size:11px;padding:5px 3px}
.review-modes button[aria-pressed=true]{background:var(--white);color:var(--green);box-shadow:0 1px 3px #0001}
.piece-gallery{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:max-content;align-content:start;gap:10px;padding:4px 4px 12px;touch-action:pan-y;-webkit-overflow-scrolling:touch}
.large-piece{min-width:0;align-self:start;border:1px solid var(--line);border-radius:12px;background:var(--white);padding:0;overflow:hidden;text-align:left;color:var(--ink)}
.large-piece:disabled{opacity:1;cursor:default}
.large-piece img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:var(--white);pointer-events:none}
.piece-caption{display:flex;align-items:center;gap:5px;padding:9px 8px;min-height:44px;font-size:11px;line-height:1.3}
.piece-caption b{flex-shrink:0;color:var(--green)}.piece-caption>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.piece-caption i{display:none;font-style:normal;margin-left:auto;color:var(--green)}
.large-piece.on{border:2px solid var(--green)}.large-piece.on .piece-caption i{display:block}
.piece-pages{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-shrink:0;padding:5px 4px 8px;font-size:12px;color:var(--muted)}
.piece-pages button{min-height:38px;padding:6px 12px;background:var(--white);border:1px solid var(--line);border-radius:10px;color:var(--green);font-size:12px}
/* Action bar: always below the sheet, never over it. */
.bar{flex-shrink:0;padding:0 14px calc(8px);border-top:1px solid var(--line);background:var(--paper)}
.strip{min-height:34px;display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;font-size:12px;padding:6px 0 0;color:var(--ink)}
.strip.empty{min-height:8px;padding:0}
.strip.bad{color:var(--red)}.strip.warn{color:var(--amber)}
.strip-text{flex:1;min-width:60%}
.strip .chip{padding:4px 10px;min-height:30px;font-size:11px}
.pulse{color:var(--green);font-weight:600;animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.4}}
.actions{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0 4px}
.actions .cta{margin-top:0}
.actions.two .cta{flex:1}
.round{width:76px;border:0;background:none;padding:0;display:flex;flex-direction:column;align-items:center;flex-shrink:0}
.round .dot{width:56px;height:56px;border-radius:50%;border:1px solid var(--line);background:var(--white);font-size:22px;display:flex;align-items:center;justify-content:center}
.round small{font-size:10px;font-weight:600;margin-top:3px;white-space:nowrap}
.round.pass{color:var(--red)}
.round.save .dot{background:var(--green);border-color:var(--green);color:#fff}
.round.save small{color:var(--green)}
.mic{flex:1;height:56px;border-radius:28px;border:1px solid #cdd8c7;background:var(--white);color:var(--green);font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1}
.mic small{font-size:10px;font-weight:500;color:var(--muted);margin-top:3px}
.mic-dot,.rec-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--red);margin-right:6px;vertical-align:1px}
.actions.rec .cta{flex:0 0 96px}
.recording{flex:1;height:56px;border-radius:28px;border:2px solid var(--red);background:#a15d4a12;color:var(--red);font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1}
.recording small{font-size:10px;font-weight:500;margin-top:3px}
.rec-dot{animation:pulse 1s infinite}
.lay .row label{margin-top:4px}
.lay input:not([type=range]),.lay select{padding:6px 8px;font-size:16px}
.tabs{flex-shrink:0;display:flex;border-top:1px solid var(--line);background:var(--white);padding:0 6px env(safe-area-inset-bottom)}
.tabs button{white-space:nowrap;flex:1;border:0;background:none;min-height:50px;font-size:12px;color:var(--muted);font-weight:500}
.tabs button.active{color:var(--green);font-weight:700;box-shadow:inset 0 2px 0 var(--green)}
.tabs b{display:inline-block;min-width:18px;padding:1px 5px;border-radius:9px;background:var(--green);color:#fff;font-size:10px}

/* Chosen + images */
.fav{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.fav>img{width:104px;height:104px;object-fit:contain;border-radius:10px;background:var(--white);border:1px solid var(--line);flex-shrink:0}
.fav>div{min-width:0}
.fav h3,.item h3{font-family:Cormorant,Georgia,serif;font-size:20px;font-weight:600;margin:0 0 4px}
.fav .eyeline,.item .eyeline{margin-top:0}
.note{font-size:13px;font-style:italic;margin:4px 0}
.batch h2{font-family:Cormorant,Georgia,serif;font-size:22px;font-weight:600;margin:18px 0 6px}
.item{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:12px;margin-bottom:12px}
.pics{display:flex;gap:8px;margin-bottom:10px}
.pics a{flex:3}.pics a img,.ph{width:100%;aspect-ratio:3/4;object-fit:contain;border-radius:10px;background:var(--paper);display:block}
.pics img.src{flex:1;width:30%;align-self:flex-start;aspect-ratio:1;object-fit:contain;border-radius:8px;border:1px solid var(--line);background:var(--paper)}
.ph{flex:3;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);font-weight:600;text-transform:capitalize}
.ph small{font-weight:400;font-size:11px;text-transform:none}
.ph.failed,.ph.held{color:var(--red)}
.hold{font-size:12px;color:var(--red);margin:4px 0}
.specs{font-size:11px;color:var(--amber);margin:4px 0}
.box{border:1px solid var(--line);background:var(--white);border-radius:16px;padding:14px;margin:14px 0}
.box h2{font-family:Cormorant,Georgia,serif;font-size:22px;font-weight:600;margin:0 0 4px}
.box ul{margin:4px 0 8px;padding-left:18px;font-size:13px}
pre{white-space:pre-wrap;font-size:11px;background:var(--paper);padding:10px;border-radius:8px}
.overlay{position:fixed;inset:0;background:#1d2b25b3;display:flex;align-items:flex-end;justify-content:center;z-index:50}
.overlay[hidden]{display:none}
.panel,.inspect{width:100%;max-width:560px;background:var(--paper);border-radius:20px 20px 0 0;padding:18px 18px calc(18px + env(safe-area-inset-bottom))}
.inspect img{display:block;width:100%;max-height:55vh;object-fit:contain;background:var(--white);border-radius:12px}
@media(max-height:680px){.round .dot{width:48px;height:48px}.mic,.recording{height:50px}.mic small{display:none}.sheet-head{padding:4px 0 2px}.nav-arrow{width:34px;height:34px}}
/* The review sheet is the focal point. Controls stay compact and in document flow. */
body{font-family:-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif}
.wordmark{font-size:26px}.sheet-title b{font-size:23px;font-weight:500}
.sheet-head{padding-top:12px}.hint{color:var(--muted);font-size:12px;line-height:1.45;margin:4px 14px 10px}
.stage{position:relative;overflow:hidden;padding:3px 0 8px}
.swipe-stage{touch-action:none}
.swipe-stage .cell{pointer-events:none}
.stage::after{content:attr(data-direction);position:absolute;top:20px;left:50%;transform:translateX(-50%);color:var(--green);font-size:22px;font-weight:700;pointer-events:none;background:var(--paper);border-radius:8px;padding:3px 10px;opacity:0}
.stage[data-direction=Explore]::after,.stage[data-direction=Pass]::after{opacity:1}
.stage[data-direction=Pass]::after{color:var(--red)}
.sheet-box{will-change:transform}.cell:disabled{opacity:1}
.selection-tools{display:flex;justify-content:space-between;gap:12px;font-size:12px}
.round small{font-size:11px;font-weight:500}.mic{font-weight:500;font-size:13px;background:transparent}
.tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;min-height:58px}
.tabs svg{width:21px;height:21px}.tabs b{font-size:9px}.cta{font-size:14px;font-weight:500}
.upload-target{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;min-height:150px;background:var(--pale);border:1px dashed #9baa99;border-radius:14px;color:var(--green)}
.upload-target svg{width:30px;height:30px}.upload-target strong{font-size:16px;font-weight:500}.upload-target span{font-size:12px;color:var(--muted)}
@media(max-height:680px){.hint{font-size:11px;margin-bottom:5px}.sheet-head{padding-top:5px}.tabs button{min-height:50px}.sheet-title b{font-size:19px}}
.spinner{display:inline-block;width:18px;height:18px;border:2px solid var(--line);border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}
@keyframes spin{to{transform:rotate(360deg)}}
.processing{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:13px}
.voice-meter{height:24px;display:flex;align-items:center;justify-content:center;gap:3px;margin-bottom:3px}
.voice-meter i{display:block;width:3px;height:5px;background:var(--red);border-radius:2px;transition:height .08s}
.recording{height:78px;font-size:12px}.recording small{font-size:11px}.actions.rec .cta{flex-basis:72px}
.feedback-panel{max-height:205px;overflow-y:auto;padding:10px 0;font-size:13px;line-height:1.45}
.feedback-panel p{margin:5px 0}.assistant-label{color:var(--green);font-size:10px;text-transform:uppercase;letter-spacing:.6px}
.feedback-actions{display:flex;gap:8px}.feedback-actions .cta{font-size:12px;min-height:42px;padding:8px}
.render-group{margin:16px 0;border:1px solid var(--line);border-radius:16px;background:var(--white);overflow:hidden}
.variant-label{margin:0;padding:12px 12px 2px;color:var(--green);font-size:11px}.render-group .item{border:0;margin:0}
.pics{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;align-items:start}
.pics a{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;background:#fff;border-radius:10px}
.pics a img{width:100%;height:auto;max-height:460px;aspect-ratio:3/4;object-fit:contain;object-position:center;background:#fff}
.pics img.src{width:64px;height:64px;aspect-ratio:1;justify-self:end;object-fit:contain}
.pics .ph{width:100%;min-height:280px;aspect-ratio:3/4}
.job-progress{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:18px 8px;text-align:center;width:100%;text-transform:none}
.job-progress strong{font-size:13px;font-weight:500}.job-progress small{font-size:10px;font-weight:400;line-height:1.4}
.job-progress ol{list-style:none;margin:0;padding:0;width:100%;display:flex;gap:3px}
.job-progress li{flex:1;font-size:8px;border-top:3px solid var(--line);padding-top:5px;overflow-wrap:anywhere}
.job-progress li.complete{border-color:var(--green);color:var(--green)}.job-progress li.current{border-color:var(--gold);color:var(--ink)}
@media(prefers-reduced-motion:reduce){.pulse,.rec-dot,.spinner{animation:none}.voice-meter i{transition:none}}
