.app-header{
  position:static;background:#000;block-size:var(--header-row-height);padding-inline:max(16px,calc((100vw - 660px)/2))
}
.app-brand,.app-header-actions{display:flex;align-items:center;gap:10px}
.app-brand{align-self:stretch}
.app-brand-role{
  margin:0;color:#b9b7b5;font:650 calc(var(--logo-width) * .124)/1 system-ui,sans-serif;
  letter-spacing:.035em;text-transform:uppercase;white-space:nowrap;text-box:trim-both cap alphabetic
}
.app-header-actions{justify-content:flex-end;min-width:0}
main{width:min(100%,692px);margin:auto;padding:24px 16px 40px}
h1,h2,h3,p{margin:0 0 12px}
h1{font-size:clamp(1.75rem,6vw,2.65rem);line-height:1.12;letter-spacing:-.025em;overflow-wrap:anywhere}
h2{font-size:1.2rem;line-height:1.3}
.work-hero{padding:clamp(16px,3vw,28px);margin-bottom:18px}
p{overflow-wrap:anywhere}
form{display:grid;gap:12px}
label{display:grid;gap:5px;font-weight:700}
input,select,textarea{width:100%}
textarea{resize:vertical}
.danger{background:#4a2927;color:#ffd5cd}
.compact{min-height:36px;padding:7px 10px;font-size:12px}
.app-header .compact{
  position:relative;min-height:0;height:var(--header-control-height);padding:0 8px;
  font-size:clamp(10px,calc(var(--logo-width) * .086),12px);line-height:1;white-space:nowrap;text-transform:uppercase
}
.app-header .compact::before{
  content:"";position:absolute;inset-block:calc((100% - 36px) / 2);inset-inline:0
}
.app-header .compact svg{display:none}
.card{padding:clamp(14px,2vw,20px);margin:15px 0}
.kicker{color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.11em}
.amount{font-size:clamp(36px,11vw,66px);line-height:1.06;font-weight:900;color:var(--accent)}
.muted{color:var(--text-muted)}
.message{min-height:1.45em;color:#ffcf68;margin:10px 0 0}
.error{color:#ff9b8f}
.row{display:flex;gap:10px;flex-wrap:wrap}
.row>*{flex:1}
.staff-actions[hidden]{display:none}
.staff-pin{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.staff-pin code{font-size:1.15rem;letter-spacing:.12em}
.staff-pin-editor{margin:0 0 14px}
.check{display:flex;align-items:flex-start;gap:9px;font-weight:600}
.check input{flex:none;width:auto;min-height:0;margin-top:4px}
.review-form{display:grid;gap:12px;margin-top:14px}
.manager-contact{display:inline-block;padding:7px 10px;border-radius:7px;background:#493b25;color:#ffe18d;font-weight:800}
.certificate-binding{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px;margin:14px 0}
.scanner{display:grid;gap:10px;margin:15px 0}
.scanner video{display:block;width:100%;max-height:55svh;min-height:140px;border-radius:10px;background:#100d0c;object-fit:contain}
.scanner video[hidden]{display:none}
.scanner input[type=file]{min-height:auto;font-weight:400}
.qr-icon{flex:none;width:20px;height:20px;margin-inline-end:7px}
.photo-input{font-size:.9rem}
ul{padding-left:22px}
summary{cursor:pointer}
.install-offer{border-color:#9a7432}
#app.cashier-workspace{width:min(100%,1120px);padding-inline:clamp(14px,3vw,30px)}
.cashier-grid{display:grid;gap:14px;margin:18px 0;align-items:start}
.cashier-panel{margin:0;padding:clamp(14px,2.6vw,24px)}
.cashier-panel p:last-child{margin-bottom:0}
.cashier-grid .message:empty{min-height:0;margin:0}
.cashier-grid .scanner{gap:12px}
.cashier-workspace .scanner video{width:100%;max-height:48svh}
.cashier-balance{grid-area:balance}
.cashier-checkout{grid-area:checkout;min-width:0}
.cashier-history{grid-area:history}
.cashier-history-note{margin:4px 0;white-space:pre-wrap}
.cashier-redemption-grid{grid-template-areas:"balance" "checkout" "history"}
.cashier-actions>*{flex:1 1 132px}
@media(min-width:760px){
  .cashier-grid{gap:20px}
  .cashier-scan-grid{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
  .cashier-redemption-grid{
    grid-template-columns:minmax(0,2fr) minmax(0,3fr);
    grid-template-areas:"balance checkout" "history checkout"
  }
  .cashier-actions>*{flex:0 1 auto}
}
html:has(>body:is(.manager-view,.staff-open)){scrollbar-gutter:stable}
:is(.manager-open,.staff-open)>.app-header{padding-inline:max(16px,calc((100% - 1148px)/2))}
.manager-open #app{width:min(100%,1180px)}
.manager-view #app{overflow-wrap:anywhere}
.manager-view #manager-install{margin-block:0 12px}
.manager-return,.staff-return{margin-block-end:12px;margin-inline-end:8px}
.manager-view .manager-auth .message:empty,.manager-view .row[hidden]{display:none}
.manager-view #app :is(input,select,textarea,button,.button){min-inline-size:0;max-inline-size:100%}
.manager-view #app :is(button,.button):not(:disabled):hover{filter:brightness(1.08)}
.manager-view #app .row > :is(button,.button){flex:1 1 145px}
.manager-view .event-line span{flex-basis:12rem;min-inline-size:0}
.manager-content .message:empty{min-height:0;margin:0}
.manager-layout{display:grid;grid-template-columns:200px minmax(0,1fr);align-items:start;gap:24px}
.manager-nav{position:sticky;top:18px;display:grid;gap:6px;padding:14px}
:is(#manager-menu-toggle,#staff-menu-toggle){display:none}
:is(#manager-menu-toggle,#staff-menu-toggle) svg{flex:none}
.manager-nav a{padding:10px 12px;border:1px solid transparent;border-radius:var(--control-radius);color:var(--text);text-decoration:none;font-weight:700}
.manager-nav a:hover{background:#302622}
.manager-nav a[aria-current="page"]{border-color:#a27a34;background:#3b2e20;color:var(--accent);box-shadow:inset 3px 0 var(--accent)}
.manager-nav a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.manager-nav details summary{padding:10px 12px;font-weight:700;border-radius:var(--control-radius)}
.manager-nav details summary:hover{background:#302622}
.manager-subnav{display:grid;gap:2px;padding-left:8px}
.manager-subnav a{font-size:.9rem}
:is(#manager-nav,#staff-workspace-menu) :is(a,summary){
  display:flex;align-items:center;min-block-size:44px;padding:10px 12px;
  border:1px solid transparent;border-radius:var(--control-radius);line-height:1.3
}
#manager-nav summary{justify-content:space-between;gap:10px;list-style:none}
#manager-nav summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#manager-nav summary::-webkit-details-marker{display:none}
#manager-nav summary::after{
  content:"";width:7px;height:7px;flex:none;border:solid currentColor;border-width:0 2px 2px 0;
  transform:translateY(-2px) rotate(45deg)
}
#manager-nav details[open]>summary::after{transform:translateY(2px) rotate(225deg)}
#manager-nav details.is-active>summary{background:var(--secondary);color:var(--accent)}
#manager-nav .manager-subnav{margin-block-start:4px;margin-inline-start:10px;padding-inline-start:6px;border-inline-start:1px solid var(--surface-border)}
#manager-nav a[aria-current="page"]{border-color:#a27a34}
.manager-nav-reference{display:grid;border-top:1px solid var(--surface-border);padding-top:10px;margin-top:8px}
.staff-identity{margin:0;padding:8px 12px;color:var(--text-muted);font-size:.8rem;overflow-wrap:anywhere}
.staff-direction-control{max-width:22rem}
#staff-workspace-menu .staff-direction-control{padding:0 8px 8px;font-size:.875rem}
.staff-direction-group{display:grid;gap:12px}
.staff-direction-group > :is(h3,p,.card){margin:0}
.staff-direction-group h4,.direction-pin h4{margin:0 0 8px;font-size:1.05rem}
.staff-direction-group + .staff-direction-group,.direction-pin + .direction-pin{margin-top:16px;padding-top:16px;border-top:1px solid var(--surface-border)}
.staff-direction-form{grid-template-columns:minmax(0,18rem) auto;justify-content:start;align-items:end;margin:12px 0}
.workspace-publish-schedule{margin-bottom:12px}
fieldset.workspace-schedule{border:0;margin:0;padding:0}
#app.staff-workspace{width:min(100%,1180px)}
.staff-workspace .manager-content{min-width:0}
.staff-workspace summary{font-weight:750}
.staff-workspace details[open] > summary{margin-block-end:12px}
.staff-workspace ol{padding-inline-start:24px}
.staff-workspace li + li{margin-block-start:6px}
.staff-schedule-toolbar{display:flex;flex-wrap:wrap;align-items:end;gap:12px}
.staff-schedule-toolbar label{flex:1 1 200px;max-width:340px}
.staff-schedule-days{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;margin-block:16px}
.staff-schedule-days .card{margin:0}
.staff-schedule-days dl{margin:0}
.staff-schedule-days dt{font-weight:750}
.staff-schedule-days dd{margin:0 0 8px;color:var(--text-muted)}
.workspace-schedule,.workspace-day,.workspace-fields{display:grid;gap:12px;min-width:0}
.workspace-fields{grid-template-columns:repeat(auto-fit,minmax(min(100%,145px),1fr))}
fieldset.workspace-fields{margin:12px 0;padding:12px;border:1px solid var(--surface-border);border-radius:var(--control-radius)}
.workspace-guide summary{font-weight:750;cursor:pointer}
.workspace-guide .row{margin-top:12px}
.workspace-fields button{grid-column:1/-1;justify-self:start}
.workspace-day legend,.workspace-fields legend{padding-inline:6px;font-weight:700}
.workspace-schedule .staff-schedule-days{margin:0}
.reference-links{list-style:none;margin:0;padding:0}
.reference-links li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 12px;align-items:center;padding:12px 0}
.reference-links li + li{border-top:1px solid var(--surface-border)}
.reference-links a{grid-column:1;color:var(--accent);overflow-wrap:anywhere}
.reference-links button{grid-column:2;grid-row:1 / span 2}
#manager-event-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-block:12px 20px;border-bottom:1px solid var(--surface-border)}
#manager-event-tabs a{display:inline-flex;align-items:center;min-block-size:44px;padding:8px 12px;color:var(--text);text-decoration:none;border-bottom:3px solid transparent}
#manager-event-tabs a:hover{background:#302622}
#manager-event-tabs a[aria-current="page"]{border-bottom-color:var(--accent);color:var(--accent);font-weight:700}
#manager-event-tabs a:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.summary-certificates{margin:10px 0}
.summary-certificates li{padding-block:3px}
.summary-certificates li p{margin:3px 0 6px}
.manager-content{min-width:0}
:is(.control-panel-content,.staff-workspace .manager-content) > section,
.control-panel-content :is(.private-content,#manager-recipients,#manager-results,#manager-certificates){
  display:grid;align-content:start;gap:16px
}
:is(.control-panel-content,.staff-workspace .manager-content) > section > h2{
  margin:0;padding-block-end:12px;border-bottom:1px solid var(--surface-border);
  font-size:clamp(1.4rem,3vw,1.9rem);line-height:1.2;letter-spacing:-.02em
}
.control-panel-content :is(#administrators,#employees,#devices,#issued,#private-issued,#recipients,#event-results){
  display:grid;gap:12px
}
.control-panel-content :is(#administrators,#employees,#devices,#issued,#private-issued,#recipients,#event-results):empty{display:none}
.control-panel-content :is(section,.private-content,#administrators,#employees,#devices,#issued,#private-issued,#recipients,#event-results) > .card{
  margin-block:0
}
.control-panel-content :is(.private-content,#manager-recipients,#manager-results,#manager-certificates) > :is(h3,p){margin:0}
.control-panel-content #manager-event-tabs{margin-block:0}
.control-toolbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px}
.control-toolbar p{margin:0}
.highlight{color:var(--accent);font-weight:800}
.event-edit{margin:14px 0}
.event-line{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0}
.event-line span{flex:1}
.telegram-qr{width:min(100%,440px);height:auto}
.telegram-confirmation{padding:10px 12px;border:1px solid var(--surface-border);border-radius:var(--control-radius)}
.telegram-confirmation form{margin-top:10px}
.participant>summary,#prize-catalog>summary{font-weight:800}
.participant[open]>summary,#prize-catalog[open]>summary{margin-bottom:12px}
#issued article>*{margin-bottom:10px}
@media(max-width:760px){
  .manager-view #app{padding:16px 12px 32px}
  .manager-layout{grid-template-columns:minmax(0,1fr);gap:12px}
  :is(#manager-menu-toggle,#staff-menu-toggle){display:inline-flex;justify-content:flex-start;gap:10px}
  :is(#manager-menu-toggle,#staff-menu-toggle)[aria-expanded="false"]+.manager-nav{display:none}
  .manager-nav{position:static;padding:10px}
  .manager-nav :is(a,summary){min-block-size:44px}
  .manager-view .card .card{padding:12px}
  .staff-workspace .reference-links li{grid-template-columns:minmax(0,1fr);gap:6px}
  .staff-workspace .reference-links button{grid-column:1;grid-row:auto;justify-self:start}
  .staff-direction-form{grid-template-columns:minmax(0,1fr)}
  .certificate-binding{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:520px){
  :is(#install-app,#manager-cashier,#header-staff){min-width:24px;padding:0}
  :is(#install-app,#manager-cashier,#header-staff) span{display:none}
  :is(#install-app,#manager-cashier,#header-staff) svg{display:block;width:min(20px,calc(var(--header-control-height) * .72));height:auto}
}
@media(max-width:420px){
  .app-header,:is(.manager-open,.staff-open)>.app-header{gap:6px;padding-inline:8px}
  .app-brand,.app-header-actions{gap:6px}
  h1.app-brand-role{font-size:calc(var(--logo-width) * .108)}
  .app-header .compact{padding-inline:5px}
}
@media(max-width:480px){
  #logout{min-width:24px;padding:0}
  #logout span{display:none}
  #logout svg{display:block;width:calc(var(--header-control-height) * .72);height:auto}
}
@media(max-width:960px){
  :is(.manager-open,.staff-open)>.app-header{gap:6px;padding-inline:8px}
  :is(.manager-open,.staff-open) :is(.app-brand,.app-header-actions){gap:6px}
  :is(.manager-open,.staff-open) h1.app-brand-role{font-size:calc(var(--logo-width) * .108)}
  :is(.manager-open,.staff-open) :is(#install-app,#header-staff,#manager-cashier,#logout){min-width:24px;padding-inline:0}
  :is(.manager-open,.staff-open) :is(#install-app,#header-staff,#manager-cashier,#logout) span{display:none}
  :is(.manager-open,.staff-open) :is(#install-app,#header-staff,#manager-cashier,#logout) svg{
    display:block;width:min(20px,calc(var(--header-control-height) * .72));height:auto
  }
}
@media(max-width:420px){
  :is(.manager-open,.staff-open)>.app-header{--logo-width:clamp(78px,calc(30vw - 18px),var(--brand-logo-width));padding-inline:6px}
  :is(.manager-open,.staff-open) .app-header-actions{gap:4px}
}