/* Northbound app.css — nb-fix004 (Poshmark-style structure on the Northbound palette). Consumes tokens.css only. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--nb-ivory);color:var(--nb-ink);font-family:var(--font-ui);font-size:var(--fs-md);line-height:var(--lh-body)}
body.has-buybar{padding-bottom:84px}
a{color:var(--nb-forest)} img{max-width:100%;display:block} button{font:inherit}
h1,h2,h3{font-family:var(--font-display);font-weight:600;line-height:var(--lh-tight);margin:0 0 var(--sp-3)}
h1{font-size:var(--fs-xl)} h2{font-size:var(--fs-lg)}
h4{font-family:var(--font-ui);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.1em;color:var(--nb-muted);margin:0 0 var(--sp-2)}
.display{font-size:var(--fs-2xl);font-weight:500;letter-spacing:-.01em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.pg{padding-top:var(--sp-5);padding-bottom:var(--sp-8)}
.muted{color:var(--nb-muted)} .small{font-size:var(--fs-sm)} .center{text-align:center}
.eyebrow{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.14em;color:var(--nb-brass-2);margin:0 0 var(--sp-2)}
.lede{font-size:var(--fs-md);max-width:52ch;color:var(--nb-ink-2);margin:0 0 var(--sp-4)}
.link{font-weight:600;text-decoration:none;color:var(--nb-forest)} .link--btn{background:none;border:0;padding:0;cursor:pointer;text-decoration:underline} .link--danger{color:var(--nb-wine)}
.skip{position:absolute;left:-999px;top:0;background:var(--nb-ink);color:var(--nb-ivory);padding:var(--sp-2) var(--sp-3)}.skip:focus{left:var(--sp-2);z-index:100}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:.8rem 1.1rem;border-radius:var(--radius-sm);border:1px solid var(--nb-ink);font:600 var(--fs-sm) var(--font-ui);text-decoration:none;cursor:pointer;background:transparent;color:var(--nb-ink);transition:background .15s,color .15s,border-color .15s;white-space:nowrap}
.btn--ink{background:var(--nb-ink);color:var(--nb-ivory)}.btn--ink:hover{background:var(--nb-ink-2)}
.btn--brass{background:var(--nb-brass);border-color:var(--nb-brass)}.btn--brass:hover{background:var(--nb-brass-2);color:var(--nb-ivory)}
.btn--ghost{border-color:var(--nb-ink)}.btn--ghost:hover{background:var(--nb-paper)}
.btn--grow{flex:1} .btn[disabled]{opacity:.5;pointer-events:none}
/* header */
.hd{background:var(--nb-paper);border-bottom:1px solid var(--nb-line);position:sticky;top:0;z-index:50}
.hd__row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--gutter);max-width:var(--wrap);margin:0 auto}
.hd__burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;background:none;border:0;cursor:pointer;padding:8px}
.hd__burger span{display:block;height:2px;background:var(--nb-ink);transition:transform .2s,opacity .2s}
.hd__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}.hd__burger[aria-expanded="true"] span:nth-child(2){opacity:0}.hd__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.hd__logo{display:inline-flex;align-items:center;gap:var(--sp-2);text-decoration:none;color:var(--nb-ink)}
.hd__mark{width:36px;height:36px;border-radius:50%;background:var(--nb-brass);color:var(--nb-ink);display:grid;place-items:center;font:700 1.15rem var(--font-display)}
.hd__word{font-family:var(--font-display);font-size:var(--fs-lg);display:none}
.hd__search{flex:1;display:flex;align-items:center;gap:var(--sp-2);background:var(--nb-ivory);border:1px solid var(--nb-line);border-radius:999px;padding:.55rem .9rem;color:var(--nb-muted)}
.hd__search input{flex:1;border:0;background:transparent;font:var(--fs-md) var(--font-ui);color:var(--nb-ink);min-width:0;outline:none}
.hd__link{font:700 var(--fs-xs) var(--font-ui);letter-spacing:.08em;color:var(--nb-wine);text-decoration:none;white-space:nowrap}
.nav{display:none;flex-direction:column;background:var(--nb-paper);border-top:1px solid var(--nb-line);box-shadow:var(--shadow)}
.nav.is-open{display:flex}
.nav a{padding:var(--sp-4) var(--gutter);border-bottom:1px solid var(--nb-line);text-decoration:none;color:var(--nb-ink);font-size:var(--fs-md)}
.nav__cta{color:var(--nb-brass-2)!important;font-weight:700}
/* chips */
.chips{display:flex;gap:var(--sp-2);overflow-x:auto;padding:var(--sp-1) 0 var(--sp-4);margin:0 calc(-1*var(--gutter));padding-left:var(--gutter);padding-right:var(--gutter);scrollbar-width:none}.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;padding:.5rem .95rem;border:1px solid var(--nb-ink);border-radius:999px;font-size:var(--fs-sm);text-decoration:none;color:var(--nb-ink);background:var(--nb-paper);cursor:pointer;user-select:none}
.chip--on{background:var(--nb-ivory-2);border-width:2px;font-weight:600}
.chip--radio input,.chip--check input{position:absolute;opacity:0;pointer-events:none}
.chip--radio,.chip--check{position:relative}
.chip--radio:has(input:checked),.chip--check:has(input:checked){background:var(--nb-ink);color:var(--nb-ivory);border-color:var(--nb-ink)}
.chip--solo{display:inline-flex;margin-top:var(--sp-2)}
/* grid */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-3) var(--sp-3)}
.card{position:relative;display:flex;flex-direction:column;gap:var(--sp-2)}
.card__img{position:relative;display:block;aspect-ratio:1/1;background:var(--nb-ivory-2);border-radius:var(--radius-sm);overflow:hidden}
.card__img img{width:100%;height:100%;object-fit:cover}
.card__noimg{display:grid;place-items:center;height:100%;color:var(--nb-muted);font-size:var(--fs-sm)}
.card__sold{position:absolute;left:var(--sp-2);top:var(--sp-2);background:var(--nb-ink);color:var(--nb-ivory);font:600 var(--fs-xs) var(--font-ui);padding:.25rem .55rem;border-radius:var(--radius-sm)}
.card__body{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:var(--nb-ink)}
.card__title{font-size:var(--fs-sm);line-height:1.3;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.card__price{font-weight:700;font-size:var(--fs-md)}
.heart{position:absolute;right:var(--sp-2);top:var(--sp-2);width:38px;height:38px;border-radius:50%;background:var(--nb-paper);border:0;display:grid;place-items:center;cursor:pointer;color:var(--nb-ink);box-shadow:0 1px 3px rgba(0,0,0,.15);z-index:2}
.heart svg path{fill:transparent}
.heart.is-on{color:var(--nb-wine)} .heart.is-on svg path{fill:currentColor}
.empty{padding:var(--sp-8) var(--sp-4);border:1px dashed var(--nb-line);border-radius:var(--radius);text-align:center}
/* item page */
.item{padding-bottom:var(--sp-6)}
.car{position:relative;background:var(--nb-ivory-2)}
.car__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.car__track::-webkit-scrollbar{display:none}
.car__slide{flex:0 0 100%;margin:0;scroll-snap-align:start;aspect-ratio:1/1;max-height:70vh}
.car__slide img{width:100%;height:100%;object-fit:cover}
.car__count{position:absolute;right:var(--sp-3);bottom:var(--sp-3);background:rgba(35,35,35,.75);color:var(--nb-ivory);font:600 var(--fs-xs) var(--font-ui);padding:.3rem .6rem;border-radius:var(--radius-sm)}
.item__soldbadge{position:absolute;left:var(--sp-3);top:var(--sp-3);background:var(--nb-ink);color:var(--nb-ivory);font:700 var(--fs-sm) var(--font-ui);padding:.35rem .7rem;border-radius:var(--radius-sm)}
.item__top{display:flex;align-items:center;justify-content:space-between;padding-top:var(--sp-4)}
.item__maker{color:var(--nb-ink-2);font-size:var(--fs-md)}
.item__acts{display:flex;gap:var(--sp-2)}
.iconbtn{width:40px;height:40px;border:0;background:none;cursor:pointer;display:grid;place-items:center;color:var(--nb-ink)}
.iconbtn.heart{position:static;box-shadow:none;background:none}
.item__title{font-size:var(--fs-xl);margin:var(--sp-2) 0}
.item__price{font-size:var(--fs-lg);font-weight:700;margin:0 0 var(--sp-3)}
.specs{display:grid;grid-template-columns:max-content 1fr;gap:var(--sp-2) var(--sp-5);margin:var(--sp-4) 0;font-size:var(--fs-sm)}
.specs dt{font-weight:700;color:var(--nb-ink)}.specs dd{margin:0}
.item__desc{font-size:var(--fs-md);color:var(--nb-ink-2)}.item__desc.is-clamped{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.trust{margin-top:var(--sp-6);padding-top:var(--sp-5);border-top:1px solid var(--nb-line)}
.trust__row{display:flex;gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:1px solid var(--nb-line);align-items:flex-start}
.trust__row div{display:flex;flex-direction:column;gap:2px}.trust__row b{font-size:var(--fs-md)}.trust__row span{font-size:var(--fs-sm);color:var(--nb-ink-2)}
.more{margin-top:var(--sp-6)}
.buybar{position:fixed;left:0;right:0;bottom:0;display:flex;gap:var(--sp-3);padding:var(--sp-3) var(--gutter) calc(var(--sp-3) + env(safe-area-inset-bottom));background:var(--nb-paper);border-top:1px solid var(--nb-line);z-index:40}
/* forms */
.form{display:grid;gap:var(--sp-4)}
.form label{display:grid;gap:var(--sp-1);font-size:var(--fs-sm);font-weight:600}
.form input[type=text],.form input[type=email],.form input[type=password],.form input[type=number],.form input[type=search],.form textarea,.form select{font:var(--fs-md) var(--font-ui);padding:.85rem .9rem;border:1px solid var(--nb-line);border-radius:var(--radius);background:var(--nb-paper);color:var(--nb-ink);width:100%}
.form textarea{resize:vertical;min-height:140px}
.form input:focus,.form textarea:focus,.form select:focus{outline:2px solid var(--nb-brass);outline-offset:1px;border-color:var(--nb-brass)}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.form__error{color:var(--nb-wine);font-size:var(--fs-sm);background:rgba(110,47,58,.08);padding:var(--sp-3);border-radius:var(--radius)}
.chipset{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:var(--sp-2)}.chipset legend{font-size:var(--fs-sm);font-weight:600;margin-bottom:var(--sp-2);padding:0}
.section--narrow{max-width:520px}
/* editor */
.editor__head{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4)}.editor__head h1{margin:0;flex:1}
.status{font:600 var(--fs-xs) var(--font-ui);padding:.25rem .6rem;border-radius:999px;background:var(--nb-ivory-2);text-transform:uppercase;letter-spacing:.06em}
.status--active{background:var(--nb-forest);color:var(--nb-ivory)}.status--sold{background:var(--nb-ink);color:var(--nb-ivory)}.status--draft{background:var(--nb-brass);color:var(--nb-ink)}
.photos{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2)}
.photos__add{aspect-ratio:1/1;border:2px dashed var(--nb-line);border-radius:var(--radius);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);cursor:pointer;color:var(--nb-ink-2);font-size:var(--fs-sm);font-weight:600;background:var(--nb-paper)}
.photos__tile{position:relative;aspect-ratio:1/1;border-radius:var(--radius);overflow:hidden;background:var(--nb-ivory-2)}
.photos__tile img{width:100%;height:100%;object-fit:cover}
.photos__tile.is-primary{outline:3px solid var(--nb-brass)}
.photos__tile.is-uploading{opacity:.5}
.photos__x,.photos__star{position:absolute;top:4px;width:28px;height:28px;border-radius:50%;border:0;background:rgba(35,35,35,.8);color:var(--nb-ivory);cursor:pointer;display:grid;place-items:center;font-size:16px;line-height:1}
.photos__x{right:4px}.photos__star{left:4px}.is-primary .photos__star{background:var(--nb-brass);color:var(--nb-ink)}
.aitoggle{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);margin:var(--sp-4) 0;border:1px solid var(--nb-line);border-radius:var(--radius-lg);background:var(--nb-paper);cursor:pointer}
.aitoggle>span:nth-child(2){flex:1;display:flex;flex-direction:column;gap:2px}.aitoggle small{color:var(--nb-muted);font-size:var(--fs-xs)}
.aitoggle__spark{font-size:1.4rem;color:var(--nb-brass)}
.aitoggle input{position:absolute;opacity:0}
.switch{width:48px;height:28px;border-radius:999px;background:var(--nb-ivory-2);position:relative;flex:0 0 auto;transition:background .2s}
.switch::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .2s}
.aitoggle input:checked+.switch{background:var(--nb-forest)}.aitoggle input:checked+.switch::after{transform:translateX(20px)}
.aitoggle input:disabled+.switch{opacity:.4}
.aistatus{padding:var(--sp-3) var(--sp-4);border-radius:var(--radius);background:rgba(176,141,87,.15);font-size:var(--fs-sm);margin-bottom:var(--sp-4)}
.aistatus.is-err{background:rgba(110,47,58,.1);color:var(--nb-wine)}
.rows{display:flex;flex-direction:column;border-top:1px solid var(--nb-line)}
.row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:1px solid var(--nb-line);text-decoration:none;color:var(--nb-ink)}
.row__img{width:64px;height:64px;border-radius:var(--radius-sm);background:var(--nb-ivory-2);overflow:hidden;flex:0 0 auto}.row__img img{width:100%;height:100%;object-fit:cover}
.row__body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.row__body b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* footer */
.ft{background:var(--nb-ink);color:var(--nb-ivory);margin-top:var(--sp-10);padding:var(--sp-8) 0 var(--sp-6)}
.ft__tag{font-family:var(--font-display);font-size:var(--fs-2xl);margin:0 0 var(--sp-6);line-height:1.1}.ft__tag em{font-style:italic;color:var(--nb-brass)}
.ft__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5);padding-bottom:var(--sp-6);border-bottom:1px solid rgba(244,239,230,.15)}
.ft a{display:block;color:var(--nb-ivory);opacity:.85;text-decoration:none;font-size:var(--fs-sm);margin-bottom:var(--sp-2)}.ft a:hover{opacity:1;color:var(--nb-brass)}
.ft__bar{display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--sp-2);padding-top:var(--sp-4);font-size:var(--fs-sm)}
.ft .muted{color:rgba(244,239,230,.6)}
/* stats (admin) */
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-3);margin-bottom:var(--sp-6)}
.stat{background:var(--nb-paper);border:1px solid var(--nb-line);border-radius:var(--radius);padding:var(--sp-4)}
.stat__n{display:block;font:600 var(--fs-2xl) var(--font-display)}.stat__l{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--nb-muted)}
.table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}.table td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--nb-line)}
@media (min-width:760px){
  .hd__word{display:inline}
  .grid{grid-template-columns:repeat(4,1fr);gap:var(--sp-5) var(--sp-4)}
  .photos{grid-template-columns:repeat(6,1fr)}
  .car__slide{aspect-ratio:4/3;max-height:640px}.car__slide img{object-fit:contain;background:var(--nb-ivory-2)}
  .item .wrap{max-width:760px}
  .buybar{justify-content:center}.buybar .btn--grow{max-width:420px}
  .form--editor{max-width:720px}
}
/* nb-fix005: kill horizontal overflow */
html,body{overflow-x:hidden;max-width:100%}
.wrap,.pg,.form,.form--editor{min-width:0;max-width:100%}
.form__row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.form__row>label,.form label,.chipset,.photos,.grid,.card{min-width:0}
.form input,.form select,.form textarea{min-width:0;max-width:100%}
.hd__row{min-width:0}
.hd__search{min-width:0}
.hd__link{max-width:28vw;overflow:hidden;text-overflow:ellipsis}
.editor__head h1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.specs{grid-template-columns:minmax(0,max-content) minmax(0,1fr)}
.specs dd{overflow-wrap:anywhere}
.item__title,.card__title,.row__body b{overflow-wrap:anywhere}
.buybar{max-width:100vw}
@media (max-width:420px){.form__row{grid-template-columns:1fr}}
/* nb-fix006 */
.photos__add--cam{background:var(--nb-ink);color:var(--nb-ivory);border-style:solid;border-color:var(--nb-ink)}
/* nb-fix008: checkout + orders */
.co__item{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) 0 var(--sp-4);border-bottom:1px solid var(--nb-line);margin-bottom:var(--sp-4)}
.co__price{font-weight:700;white-space:nowrap}
.co__totals{display:grid;gap:var(--sp-2);padding:var(--sp-4);background:var(--nb-paper);border:1px solid var(--nb-line);border-radius:var(--radius);font-size:var(--fs-sm)}
.co__totals>div{display:flex;justify-content:space-between;gap:var(--sp-3)}
.co__total{border-top:1px solid var(--nb-line);padding-top:var(--sp-2);font-size:var(--fs-md)}
.co__totals p{margin:0}
.steps{display:flex;list-style:none;margin:var(--sp-4) 0 var(--sp-5);padding:0;gap:0}
.steps li{flex:1;position:relative;text-align:center;font-size:var(--fs-xs);color:var(--nb-muted);padding-top:22px}
.steps li::before{content:"";position:absolute;top:6px;left:0;right:0;height:2px;background:var(--nb-line)}
.steps li::after{content:"";position:absolute;top:0;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--nb-ivory);border:2px solid var(--nb-line);box-sizing:border-box}
.steps li.is-done{color:var(--nb-ink);font-weight:600}.steps li.is-done::after{background:var(--nb-forest);border-color:var(--nb-forest)}.steps li.is-done::before{background:var(--nb-forest)}
.status--paid{background:var(--nb-forest);color:var(--nb-ivory)}.status--shipped{background:var(--nb-brass);color:var(--nb-ink)}.status--delivered,.status--completed{background:var(--nb-ink);color:var(--nb-ivory)}.status--pending_payment{background:var(--nb-ivory-2)}.status--cancelled{background:var(--nb-ivory-2);color:var(--nb-muted)}
