@import url("/theme.css");
/* FolioFlow - retro CRT skin: dark + neon + CRT monitor hover + 60s/70s cartoon. Tokens come from /theme.css; effects from /theme-fx.css.
   CSP-safe: no inline styles, fonts are same-origin (font-src 'self'). */
:root{
  --mono:var(--t-font-mono);--disp:var(--t-font-display);
  font-family:var(--t-font-mono);
  color:hsl(var(--t-fg));background:hsl(var(--t-bg));font-size:14px;color-scheme:dark
}
*{box-sizing:border-box}
body{margin:0;background:hsl(var(--t-bg));color:hsl(var(--t-fg));overflow-x:hidden}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.5}
a{color:hsl(var(--t-primary))}
a:hover{color:hsl(var(--t-warn));text-shadow:2px 0 hsl(var(--t-accent)/.9),-2px 0 hsl(var(--t-info)/.9)}
h1,h2,h3{font-family:var(--disp);font-weight:400;font-synthesis:none}
.skip{position:absolute;top:-100px;left:1rem;padding:.7rem 1rem;background:hsl(var(--t-primary));color:hsl(var(--t-ink));border:var(--t-stroke) solid hsl(var(--t-outline));border-radius:999px;font-family:var(--disp);z-index:300}
.skip:focus{top:1rem}
.layout{min-height:100vh;display:grid;grid-template-columns:238px minmax(0,1fr)}
.side{background-color:hsl(var(--t-bg-alt));background-image:radial-gradient(hsl(var(--t-primary)/.13) 1.3px,transparent 1.7px);background-size:14px 14px;border-right:var(--t-stroke) solid hsl(var(--t-border));display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:auto;z-index:5}
.brand{display:flex;gap:.8rem;align-items:center;padding:1.55rem 1.3rem 2.3rem;text-decoration:none;font-family:var(--disp);font-size:1.25rem;font-weight:400;letter-spacing:.03em;color:hsl(var(--t-fg));text-shadow:2px 2px 0 hsl(var(--t-accent))}
.brand:hover{text-shadow:2px 2px 0 hsl(var(--t-accent)),2px 0 hsl(var(--t-accent)/.9),-2px 0 hsl(var(--t-info)/.9);animation:crt-glitch .5s steps(2,end) 1}
.brand small{display:block;color:hsl(var(--t-muted));font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;margin-top:.2rem;text-shadow:none}
.mark{width:38px;height:38px;display:grid;place-items:center;background:hsl(var(--t-primary));color:hsl(var(--t-ink));border:var(--t-stroke) solid hsl(var(--t-outline));border-radius:12px;font-size:1.5rem;box-shadow:3px 3px 0 hsl(var(--t-accent));text-shadow:none}
.mark span{color:hsl(var(--t-ink))}
nav{padding:0 .8rem}
.nav-label{display:inline-block;margin:1.25rem .65rem .5rem;padding:.2rem .6rem;color:hsl(var(--t-ink));background:hsl(var(--t-warn));border:2px solid hsl(var(--t-outline));border-radius:8px;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;font-weight:700;transform:rotate(-2deg);box-shadow:3px 3px 0 hsl(var(--t-accent))}
nav button{position:relative;isolation:isolate;display:flex;align-items:center;gap:.85rem;width:100%;border:2px solid transparent;background:none;color:hsl(var(--t-muted));padding:.75rem .85rem;margin:.1rem 0;text-align:left;border-radius:999px;font-family:var(--mono);font-weight:700;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;transition:background .2s,color .2s,transform .12s,box-shadow .12s}
nav button::first-letter{font-size:1.2rem}
nav button:hover{background:hsl(var(--t-info)/.14);color:hsl(var(--t-fg));border-color:hsl(var(--t-info));text-shadow:2px 0 hsl(var(--t-accent)/.9),-2px 0 hsl(var(--t-info)/.9);animation:crt-pop .3s ease-out}
nav button[aria-current]{background:hsl(var(--t-primary));color:hsl(var(--t-ink));border-color:hsl(var(--t-outline));box-shadow:4px 4px 0 hsl(var(--t-accent));text-shadow:none}
nav button[aria-current]:hover{text-shadow:none}
.side-bottom{border-top:2px dashed hsl(var(--t-border));margin:auto .85rem 1rem;padding:1rem .55rem;color:hsl(var(--t-muted));font-size:.77rem;line-height:1.5}
.side-bottom strong{color:hsl(var(--t-fg))}
.side-bottom p{margin:.25rem 0 .8rem}
.side-bottom a{text-decoration:underline;text-underline-offset:3px;color:hsl(var(--t-primary));font-weight:700}
.main-wrap{min-width:0;display:flex;flex-direction:column}
.topbar{position:relative;height:66px;margin-bottom:6px;background:hsl(var(--t-bg)/.9);display:flex;justify-content:space-between;align-items:center;padding:0 clamp(1rem,3vw,3rem);gap:1rem}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:6px;background:var(--t-stripes)}
.top-start,.top-end{display:flex;align-items:center;gap:1.3rem}
.top-start button{display:none}
.breadcrumb{color:hsl(var(--t-muted));font-family:var(--mono);letter-spacing:.12em;font-size:.69rem;font-weight:700}
.breadcrumb span{color:hsl(var(--t-primary))}
.live-dot{background:hsl(var(--t-info)/.14);color:hsl(var(--t-info));border:2px solid hsl(var(--t-info));font-family:var(--mono);padding:.4rem .7rem;border-radius:999px;letter-spacing:.08em;font-size:.66rem;font-weight:700}
.live-dot::first-letter{font-size:.6rem}
#clock{font-family:var(--mono);font-size:.82rem;color:hsl(var(--t-muted))}
.avatar{background:hsl(var(--t-accent));color:hsl(var(--t-ink));border:var(--t-stroke) solid hsl(var(--t-outline));box-shadow:3px 3px 0 hsl(var(--t-info));width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700}
.reset-btn{border:2px solid hsl(var(--t-outline));background:transparent;border-radius:999px;padding:.45rem .85rem;color:hsl(var(--t-fg));font-family:var(--disp);text-transform:uppercase;letter-spacing:.07em;font-size:.76rem;box-shadow:3px 3px 0 hsl(var(--t-info));transition:transform .12s,box-shadow .12s,background .2s}
.reset-btn:hover{transform:translate(2px,2px);box-shadow:1px 1px 0 hsl(var(--t-info));background:hsl(var(--t-info)/.18);animation:crt-pop .3s ease-out}
.reset-btn:active{transform:translate(3px,3px);box-shadow:0 0 0 hsl(var(--t-info))}
.demo-ribbon{background:hsl(var(--t-warn)/.1);color:hsl(var(--t-fg));border-bottom:2px dashed hsl(var(--t-warn)/.6);padding:.7rem clamp(1rem,3vw,3rem);font-size:.76rem;line-height:1.5}
.demo-ribbon strong{color:hsl(var(--t-warn));font-family:var(--mono);letter-spacing:.07em}
#workspace{width:100%;max-width:1650px;margin:0 auto;padding:clamp(1.5rem,3vw,3rem);flex:1;position:relative;z-index:1}
.page-head{display:flex;justify-content:space-between;align-items:end;gap:1.5rem;margin-bottom:2rem;padding-bottom:1.4rem;position:relative}
.page-head::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:var(--t-stripes)}
.kicker{display:inline-block;align-self:flex-start;color:hsl(var(--t-ink));background:hsl(var(--t-warn));border:2px solid hsl(var(--t-outline));border-radius:8px;padding:.22rem .7rem;font-family:var(--mono);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.68rem;margin:0 0 .85rem;transform:rotate(-2deg);box-shadow:3px 3px 0 hsl(var(--t-accent))}
.page-head h1{font-size:clamp(1.9rem,3.2vw,2.8rem);letter-spacing:.01em;line-height:1.13;margin:0 0 .55rem;color:hsl(var(--t-fg));text-shadow:3px 3px 0 hsl(var(--t-accent))}
.page-head p:not(.kicker){margin:0;color:hsl(var(--t-muted));font-size:.92rem;max-width:55ch;line-height:1.5}
h2{letter-spacing:.01em;font-size:1.25rem;margin:0;text-shadow:3px 3px 0 hsl(var(--t-accent))}
h3{font-size:1.05rem}
.btn{position:relative;isolation:isolate;overflow:hidden;border:var(--t-stroke) solid hsl(var(--t-outline));background:transparent;border-radius:999px;color:hsl(var(--t-fg));font-family:var(--disp);font-weight:400;text-transform:uppercase;letter-spacing:.07em;padding:.65rem 1.05rem;white-space:nowrap;box-shadow:5px 5px 0 hsl(var(--t-info));transition:transform .12s ease,box-shadow .12s ease,background .2s}
.btn:not(:disabled):hover{transform:translate(2px,2px);box-shadow:3px 3px 0 hsl(var(--t-info));background:hsl(var(--t-info)/.18);animation:crt-pop .3s ease-out}
.btn:not(:disabled):active{transform:translate(5px,5px);box-shadow:0 0 0 hsl(var(--t-info))}
.btn.primary{background:hsl(var(--t-primary));color:hsl(var(--t-ink));box-shadow:5px 5px 0 hsl(var(--t-accent))}
.btn.primary:not(:disabled):hover{background:hsl(var(--t-primary));box-shadow:3px 3px 0 hsl(var(--t-accent))}
.btn.primary:not(:disabled):active{box-shadow:0 0 0 hsl(var(--t-accent))}
.btn.full{width:100%}
/* CRT screen overlay (hover) on small hoverable surfaces; never on forms, inputs or large panels */
.btn::after,.metric::after,.room-card::after,.menu-card::after,.folio-link::after,.chip::after,nav button::after,.stock-row .btn::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .2s ease;background:repeating-linear-gradient(0deg,hsl(var(--t-shade)/.34) 0 1px,transparent 1px 3px),linear-gradient(180deg,transparent,hsl(var(--t-fg)/.13) 50%,transparent) 0 -100%/100% 38% no-repeat;box-shadow:inset 0 0 38px hsl(var(--t-primary)/.38),inset 0 0 0 2px hsl(var(--t-primary)/.45)}
.btn:not(:disabled):hover::after,.metric:hover::after,.room-card:hover::after,.menu-card:hover::after,.folio-link:hover::after,.chip:hover::after,nav button:hover::after{opacity:1;animation:crt-sweep 1.3s linear infinite}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.2rem;margin-bottom:1.4rem}
.metric,.panel{--sh:var(--t-info);position:relative;isolation:isolate;border-radius:var(--t-radius);border:var(--t-stroke) solid hsl(var(--t-border));background:hsl(var(--t-surface));box-shadow:var(--t-offset) var(--t-offset) 0 hsl(var(--sh));transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.metric:nth-child(4n+1),.two-cols>.panel:nth-child(odd){--sh:var(--t-primary)}
.metric:nth-child(4n+2){--sh:var(--t-warn)}
.metric:nth-child(4n+3),.two-cols>.panel:nth-child(even){--sh:var(--t-info)}
.metric:nth-child(4n){--sh:var(--t-accent)}
.metric:hover,.panel:hover{transform:translate(-3px,-3px);border-color:hsl(var(--t-outline));box-shadow:calc(var(--t-offset) + 3px) calc(var(--t-offset) + 3px) 0 hsl(var(--sh))}
.metric:hover{animation:crt-pop .3s ease-out}
.metric{padding:1.2rem;min-height:155px;display:flex;flex-direction:column;overflow:hidden}
.metric-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:1.3rem;background:hsl(var(--t-info)/.2);color:hsl(var(--t-info));border:2px solid hsl(var(--t-info));margin-bottom:.7rem}
.metric-icon.orange{background:hsl(var(--t-warn)/.18);color:hsl(var(--t-warn));border-color:hsl(var(--t-warn))}
.metric-icon.blue{background:hsl(var(--t-primary)/.18);color:hsl(var(--t-primary));border-color:hsl(var(--t-primary))}
.metric-icon.purple{background:hsl(var(--t-accent)/.18);color:hsl(var(--t-accent));border-color:hsl(var(--t-accent))}
.metric-label{color:hsl(var(--t-muted));font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.metric strong{font-family:var(--disp);font-weight:400;font-size:1.8rem;line-height:1.35;letter-spacing:.01em;color:hsl(var(--t-fg))}
.metric:hover strong{text-shadow:2px 0 hsl(var(--t-accent)/.9),-2px 0 hsl(var(--t-info)/.9)}
.metric small{font-size:.73rem;color:hsl(var(--t-muted))}
.panel{padding:1.45rem;min-width:0}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.2rem}
.panel-head .kicker{margin-bottom:.25rem}
.two-cols{display:grid;grid-template-columns:1.1fr 1fr;gap:1.4rem;margin-bottom:1.4rem}
.steps{display:grid;gap:.6rem;margin-bottom:1.3rem}
.steps>div{display:flex;align-items:center;gap:1rem;padding:.7rem .8rem;background-color:hsl(var(--t-bg-alt));background-image:radial-gradient(hsl(var(--t-primary)/.13) 1.3px,transparent 1.7px);background-size:14px 14px;border:2px solid hsl(var(--t-border));border-radius:12px}
.steps i{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:50%;background:hsl(var(--t-warn));color:hsl(var(--t-ink));border:2px solid hsl(var(--t-outline));font-family:var(--mono);font-style:normal;font-weight:700;font-size:.72rem}
.steps strong,.steps small,.guest-row small,.room-card small,.booking small,.folio-link small{display:block}
.steps small,.guest-row small,.booking small,.folio-link small{font-size:.76rem;color:hsl(var(--t-muted));margin-top:.2rem}
.guest-row{display:flex;align-items:center;gap:.7rem;border-bottom:2px dashed hsl(var(--t-border));padding:.85rem 0;transition:background .2s}
.guest-row:hover{background:hsl(var(--t-primary)/.08)}
.guest-row:last-child{border:0}
.guest-row>div{flex:1}
.guest-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:hsl(var(--t-accent));color:hsl(var(--t-ink));border:2px solid hsl(var(--t-outline));font-weight:700}
.badge{display:inline-block;background:hsl(var(--t-info)/.16);color:hsl(var(--t-info));border:2px solid hsl(var(--t-info));font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;font-weight:700;border-radius:999px;padding:.25rem .6rem;text-transform:uppercase;white-space:nowrap}
.badge.purple{background:hsl(var(--t-accent)/.16);color:hsl(var(--t-accent));border-color:hsl(var(--t-accent))}
.badge.orange{background:hsl(var(--t-warn)/.14);color:hsl(var(--t-warn));border-color:hsl(var(--t-warn))}
.badge.blue{background:hsl(var(--t-primary)/.16);color:hsl(var(--t-primary));border-color:hsl(var(--t-primary))}
.badge.gray{background:hsl(var(--t-muted)/.1);color:hsl(var(--t-muted));border-color:hsl(var(--t-muted)/.6)}
.ticket{display:flex;align-items:center;gap:1rem;padding:1rem 0;border-top:2px dashed hsl(var(--t-border));transition:background .2s}
.ticket:hover{background:hsl(var(--t-primary)/.08)}
.ticket-mark{background:hsl(var(--t-info)/.16);padding:.75rem;border-radius:12px;border:2px solid hsl(var(--t-info));color:hsl(var(--t-info))}
.ticket-copy{flex:1;min-width:130px}
.ticket-copy strong,.ticket-copy small,.ticket-meta strong{display:block}
.ticket-copy small{font-size:.75rem;color:hsl(var(--t-muted));margin-top:.3rem}
.ticket-meta{text-align:right}
.ticket-meta strong{margin-top:.3rem}
.ticket-actions{min-width:155px;text-align:right}
.ticket-actions .btn{font-size:.72rem;padding:.5rem .75rem;box-shadow:3px 3px 0 hsl(var(--t-info))}
.room-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}
.room-card{--sh:var(--t-info);position:relative;isolation:isolate;overflow:hidden;border:2px solid hsl(var(--t-border));background:hsl(var(--t-bg-alt));border-radius:14px;padding:1rem;display:flex;flex-direction:column;gap:.35rem;box-shadow:4px 4px 0 hsl(var(--sh));transition:transform .15s,box-shadow .15s,border-color .15s}
.room-card:nth-child(3n+1){--sh:var(--t-primary)}
.room-card:nth-child(3n+2){--sh:var(--t-warn)}
.room-card:hover{transform:translate(-2px,-2px);border-color:hsl(var(--t-outline));box-shadow:6px 6px 0 hsl(var(--sh));animation:crt-pop .3s ease-out}
.room-card strong{font-size:1.35rem;font-family:var(--disp);font-weight:400}
.room-card small{color:hsl(var(--t-muted))}
.room-card>span:last-of-type{color:hsl(var(--t-info));font-weight:700;font-size:.82rem}
.room-card .btn{margin-top:.5rem;font-size:.7rem;padding:.4rem;box-shadow:3px 3px 0 hsl(var(--t-info))}
.room-top{display:flex;justify-content:space-between;align-items:center;color:hsl(var(--t-primary))}
.booking{display:flex;justify-content:space-between;gap:.7rem;border-bottom:2px dashed hsl(var(--t-border));padding:.85rem 0;transition:background .2s}
.booking:hover{background:hsl(var(--t-primary)/.08)}
.booking-actions{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:.5rem}
.booking-actions .btn{font-size:.68rem;padding:.4rem .6rem;box-shadow:3px 3px 0 hsl(var(--t-info))}
.form{margin-top:1.4rem;background-color:hsl(var(--t-bg-alt));background-image:radial-gradient(hsl(var(--t-primary)/.13) 1.3px,transparent 1.7px);background-size:14px 14px;border:var(--t-stroke) solid hsl(var(--t-border));border-radius:var(--t-radius);padding:1rem}
.form h3{margin:0}
.form p{color:hsl(var(--t-muted));font-size:.77rem}
.form label,.basket label{display:block;color:hsl(var(--t-warn));font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;font-weight:700;margin:.85rem 0 .4rem}
.form input,.form select,.form textarea,.basket select{width:100%;border:2px solid hsl(var(--t-outline)/.55);border-radius:10px;padding:.7rem;color:hsl(var(--t-fg));background:hsl(var(--t-ink));min-width:0;color-scheme:dark;transition:border-color .2s,box-shadow .2s}
.form input:hover,.form select:hover,.basket select:hover{border-color:hsl(var(--t-info))}
.form input:focus,.form select:focus,.basket select:focus{border-color:hsl(var(--t-primary));box-shadow:3px 3px 0 hsl(var(--t-primary)/.6)}
.form input::placeholder,.form textarea::placeholder{color:hsl(var(--t-muted));opacity:1}
input[type=checkbox],input[type=radio]{accent-color:hsl(var(--t-primary))}
select option{background:hsl(var(--t-ink));color:hsl(var(--t-fg))}
.form-pair{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.form .btn{margin-top:1rem}
.calendar-scroll{overflow-x:auto;padding:0 8px 8px 0}
.calendar{width:100%;min-width:800px;border-collapse:collapse;text-align:left}
.calendar th,.calendar td{padding:1rem .55rem;border-bottom:2px dashed hsl(var(--t-border));min-width:95px}
.calendar thead th{color:hsl(var(--t-warn));font-family:var(--mono);font-size:.72rem;letter-spacing:.09em}
.calendar tbody th{width:150px}
.calendar tbody th small{display:block;font-weight:400;color:hsl(var(--t-muted));margin-top:.25rem}
.cal-booked,.cal-free{display:block;border-radius:10px;padding:.6rem .4rem;font-size:.7rem;text-align:center}
.cal-booked{background:hsl(var(--t-accent)/.18);color:hsl(var(--t-accent));border:2px solid hsl(var(--t-accent));font-weight:700}
.cal-booked.active{background:hsl(var(--t-info)/.18);color:hsl(var(--t-info));border-color:hsl(var(--t-info))}
.cal-free{color:hsl(var(--t-muted));border:2px dashed hsl(var(--t-border))}
.panel-note{color:hsl(var(--t-muted));font-size:.76rem;margin:1.15rem 0 0;line-height:1.5}
.pos-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:1.4rem;align-items:start}
.chips{display:flex;gap:.6rem;flex-wrap:wrap;margin:1rem 0 1.3rem}
.chip{position:relative;isolation:isolate;overflow:hidden;border:2px solid hsl(var(--t-outline)/.6);background:transparent;color:hsl(var(--t-muted));border-radius:999px;padding:.45rem .85rem;font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;font-weight:700;font-size:.72rem;transition:background .2s,color .2s,transform .12s}
.chip:hover{color:hsl(var(--t-fg));border-color:hsl(var(--t-info));text-shadow:2px 0 hsl(var(--t-accent)/.9),-2px 0 hsl(var(--t-info)/.9)}
.chip.chosen{background:hsl(var(--t-primary));border-color:hsl(var(--t-outline));color:hsl(var(--t-ink));box-shadow:3px 3px 0 hsl(var(--t-accent));text-shadow:none}
.menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.menu-card{--sh:var(--t-info);position:relative;isolation:isolate;overflow:hidden;border:2px solid hsl(var(--t-border));background:hsl(var(--t-bg-alt));border-radius:14px;padding:1rem;min-width:0;box-shadow:4px 4px 0 hsl(var(--sh));transition:transform .15s,box-shadow .15s,border-color .15s}
.menu-card:nth-child(3n+1){--sh:var(--t-primary)}
.menu-card:nth-child(3n+2){--sh:var(--t-accent)}
.menu-card:nth-child(3n){--sh:var(--t-warn)}
.menu-card:hover{transform:translate(-2px,-2px);border-color:hsl(var(--t-outline));box-shadow:6px 6px 0 hsl(var(--sh));animation:crt-pop .3s ease-out}
.food-icon{background:hsl(var(--t-info)/.2);color:hsl(var(--t-info));border:2px solid hsl(var(--t-info));border-radius:14px;font-size:1.7rem;width:49px;height:49px;display:grid;place-items:center;margin-bottom:.7rem}
.menu-card:nth-child(2n) .food-icon{background:hsl(var(--t-accent)/.18);color:hsl(var(--t-accent));border-color:hsl(var(--t-accent))}
.menu-card:nth-child(3n) .food-icon{background:hsl(var(--t-warn)/.16);color:hsl(var(--t-warn));border-color:hsl(var(--t-warn))}
.menu-card small{color:hsl(var(--t-muted))}
.menu-card h3{margin:.25rem 0 .9rem}
.menu-card:hover h3{text-shadow:2px 0 hsl(var(--t-accent)/.9),-2px 0 hsl(var(--t-info)/.9)}
.menu-card-bottom,.basket-lines>div,.basket-bottom>div,.line,.report-line,.breakdown>div:not(.track){display:flex;justify-content:space-between;align-items:center;gap:.4rem}
.qty{display:flex;align-items:center;gap:.6rem}
.qty button{border:2px solid hsl(var(--t-outline));background:hsl(var(--t-warn));color:hsl(var(--t-ink));border-radius:50%;width:28px;height:28px;font-family:var(--disp);font-size:1.15rem;line-height:1;box-shadow:2px 2px 0 hsl(var(--t-accent));transition:transform .12s,box-shadow .12s}
.qty button:not(:disabled):hover{transform:translate(1px,1px);box-shadow:1px 1px 0 hsl(var(--t-accent));animation:crt-pop .3s ease-out}
.qty button:not(:disabled):active{transform:translate(2px,2px);box-shadow:0 0 0 hsl(var(--t-accent))}
.basket{position:sticky;top:1rem}
.basket-lines{min-height:210px;padding:1rem 0}
.basket-lines>div{padding:.5rem 0;border-bottom:2px dashed hsl(var(--t-border));font-size:.8rem}
.basket-bottom{border-top:var(--t-stroke) solid hsl(var(--t-border));padding-top:1rem}
.basket-bottom strong{font-family:var(--disp);font-weight:400;font-size:1.4rem;color:hsl(var(--t-primary));text-shadow:2px 2px 0 hsl(var(--t-accent))}
.basket-bottom p{font-size:.75rem;color:hsl(var(--t-muted));line-height:1.5}
.empty{text-align:center;color:hsl(var(--t-muted));padding:2rem 1rem}
.empty span{font-size:2rem}
.folio-layout{display:grid;grid-template-columns:minmax(210px,310px) minmax(0,1fr);gap:1.4rem;align-items:start}
.folio-link{position:relative;isolation:isolate;overflow:hidden;display:flex;justify-content:space-between;align-items:center;text-align:left;gap:.6rem;padding:.85rem;width:100%;border:2px solid hsl(var(--t-border));border-radius:14px;background:hsl(var(--t-bg-alt));color:hsl(var(--t-fg));margin-top:.7rem;box-shadow:4px 4px 0 hsl(var(--t-info));transition:transform .15s,box-shadow .15s,border-color .15s}
.folio-link:hover{transform:translate(-2px,-2px);border-color:hsl(var(--t-outline));box-shadow:6px 6px 0 hsl(var(--t-info));animation:crt-pop .3s ease-out}
.folio-link.selected{background:hsl(var(--t-primary));border-color:hsl(var(--t-outline));color:hsl(var(--t-ink));box-shadow:4px 4px 0 hsl(var(--t-accent))}
.folio-link.selected small{color:hsl(var(--t-ink))}
.folio-hero{border-radius:var(--t-radius);border:var(--t-stroke) solid hsl(var(--t-outline));background-color:hsl(var(--t-accent)/.22);background-image:radial-gradient(hsl(var(--t-primary)/.25) 1.3px,transparent 1.7px);background-size:14px 14px;color:hsl(var(--t-fg));padding:1.4rem;margin-bottom:1.6rem;box-shadow:var(--t-offset) var(--t-offset) 0 hsl(var(--t-primary))}
.folio-hero p{font-family:var(--mono);font-size:.75rem;color:hsl(var(--t-warn));font-weight:700;letter-spacing:.1em}
.folio-hero h2{font-size:1.9rem}
.folio-hero small{color:hsl(var(--t-fg))}
.folio-due{margin-top:1.5rem;display:flex;justify-content:space-between;align-items:end;gap:1rem}
.folio-due strong{font-family:var(--disp);font-weight:400;color:hsl(var(--t-warn));font-size:1.8rem;text-shadow:3px 3px 0 hsl(var(--t-ink))}
.line{border-bottom:2px dashed hsl(var(--t-border));padding:.9rem 0;font-size:.82rem}
.line span{color:hsl(var(--t-muted))}
.line.summary{font-weight:700}
.line.final{font-weight:700;border:0}
.line.final strong{font-family:var(--disp);font-weight:400;color:hsl(var(--t-info));font-size:1.25rem}
.folio-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:.8rem}
.stock-row{display:grid;grid-template-columns:1.2fr 1fr 85px 85px 90px;align-items:center;gap:1rem;padding:1rem 0;border-bottom:2px dashed hsl(var(--t-border));font-size:.8rem;transition:background .2s}
.stock-row:hover{background:hsl(var(--t-primary)/.08)}
.stock-row small{display:block;color:hsl(var(--t-muted));margin-top:.2rem}
.stock-row .btn{font-size:.68rem;padding:.45rem;box-shadow:3px 3px 0 hsl(var(--t-info))}
.stock-bar,.track{width:100%;height:10px;appearance:none;border:2px solid hsl(var(--t-outline)/.6);border-radius:999px;background:hsl(var(--t-ink));overflow:hidden}
.stock-bar::-webkit-progress-bar,.track::-webkit-progress-bar{background:hsl(var(--t-ink));border-radius:999px}
.stock-bar::-webkit-progress-value,.track::-webkit-progress-value{background:hsl(var(--t-info));border-radius:999px}
.stock-bar::-moz-progress-bar,.track::-moz-progress-bar{background:hsl(var(--t-info));border-radius:999px}
.track.blue::-webkit-progress-value{background:hsl(var(--t-accent))}
.track.blue::-moz-progress-bar{background:hsl(var(--t-accent))}
.breakdown{display:grid;gap:.9rem;padding:1rem 0}
.breakdown>div:not(.track),.report-line{padding:.45rem 0}
.breakdown span,.report-line span{color:hsl(var(--t-muted))}
.disclaimer{margin-top:1.5rem;color:hsl(var(--t-muted));font-size:.8rem}
.footer{position:relative;margin-top:6px;padding:1.15rem clamp(1rem,3vw,3rem);color:hsl(var(--t-muted));font-size:.73rem;display:flex;justify-content:space-between;gap:1rem}
.footer::before{content:"";position:absolute;left:0;right:0;top:-6px;height:6px;background:var(--t-stripes)}
.footer a{color:hsl(var(--t-primary))}
.footer span{text-align:right}
#toast{position:fixed;bottom:1.5rem;right:1.5rem;max-width:min(380px,calc(100vw - 3rem));background:hsl(var(--t-surface));color:hsl(var(--t-fg));border:var(--t-stroke) solid hsl(var(--t-info));border-radius:var(--t-radius);padding:.8rem 1.2rem;box-shadow:5px 5px 0 hsl(var(--t-info));opacity:0;pointer-events:none;transform:translateY(12px);transition:.2s;z-index:260}
#toast.show{opacity:1;transform:translateY(0)}
#toast.error{border-color:hsl(var(--t-danger));box-shadow:5px 5px 0 hsl(var(--t-danger));color:hsl(var(--t-danger))}
:focus-visible{outline:3px solid hsl(var(--t-warn));outline-offset:3px}
@media(max-width:1100px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
.two-cols,.pos-layout{grid-template-columns:1fr}
.basket{position:static}
.room-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){.layout{display:block}
.side{position:fixed;transform:translateX(-102%);transition:transform .2s;width:245px;box-shadow:5px 0 0 hsl(var(--t-accent))}
.nav-open .side{transform:translateX(0)}
.top-start button{display:block;border:0;background:transparent;font-size:1.3rem;color:hsl(var(--t-primary))}
.topbar{padding:0 1rem}
.top-end{gap:.65rem}
.live-dot span,#clock{display:none}
.demo-ribbon{padding:.7rem 1rem}
#workspace{padding:1.5rem 1rem}
.page-head{align-items:start;flex-direction:column}
.menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.ticket{flex-wrap:wrap}
.ticket-actions{width:100%;text-align:left}
.folio-layout{grid-template-columns:1fr}
.stock-row{grid-template-columns:1fr 90px;gap:.4rem}
.stock-row .stock-bar{grid-column:1/-1;grid-row:2}
.stock-row .badge{grid-column:1}
.footer{flex-direction:column}
.footer span{text-align:left}
}
@media(max-width:440px){.metrics{gap:.6rem}
.metric{padding:.85rem;min-height:140px}
.metric strong{font-size:1.35rem}
.metric-label{font-size:.63rem}
.panel{padding:1rem}
.room-grid,.menu-grid{grid-template-columns:1fr 1fr}
.room-card{padding:.7rem}
.booking{flex-direction:column}
.booking-actions{justify-content:flex-start}
.form-pair{grid-template-columns:1fr}
.reset-btn{font-size:.68rem}
.top-end{gap:.4rem}
.footer{font-size:.68rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}