/* AVCORE Backstage (public/js/backstage.js): tekijöiden oma sovellus, suunniteltu ensin puhelimelle, toimii myös tietokoneella.
   Pohja on siirretty Rentalin crew-sovelluksesta (avcore-app public/oma.css): luokat oma- ja og- säilyvät, jotta näkymät pysyvät
   samoina molemmissa. Backstagen omat lisäykset alkavat bs- ja ovat tiedoston lopussa.
   Näyttämö: lavanmusta yläosa kantaa otsikon, ja ensimmäinen kortti nousee sen päälle. Meripihka vain päätoiminnolle, tälle päivälle ja
   käynnissä olevalle työajalle. Kosketusalueet vähintään 44 px, päätoiminnot peukalon ulottuvilla alapalkin yllä.
   Käyttää app.css:n muuttujia, joten tumma tila tulee mukana. */
.oma-app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg)}
.oma-in{width:100%;max-width:560px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
.oma-top{position:sticky;top:0;z-index:20;padding-top:env(safe-area-inset-top);background:var(--brand);color:#fff}
.oma-top .oma-in{display:flex;align-items:center;gap:10px;height:54px}
.oma-top .sp{flex:1}
.oma-brand{display:flex;align-items:center;gap:9px;color:#fff;text-decoration:none}
.oma-brand svg{width:26px;height:26px}
.oma-brand b{font:800 15.5px/1 var(--f);font-stretch:122%;letter-spacing:.02em}
.oma-brand small{font:500 10px/1 var(--f-mono);letter-spacing:.18em;color:var(--amber);margin-top:2px}
.oma-av{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--amber);color:var(--amber-ink);font:700 12.5px/1 var(--f);text-decoration:none;flex:none}
.oma-av.sm{width:36px;height:36px;font-size:12.5px;background:var(--accent-soft);color:var(--accent-text)}
.oma-av.sq{border-radius:10px;background:var(--amber-soft);color:var(--amber-text)}
.oma-av.lg{width:60px;height:60px;font-size:20px}
.oma-main{flex:1;width:100%;padding-bottom:calc(88px + env(safe-area-inset-bottom));outline:none}
.oma-main.plain{max-width:592px;margin:0 auto;padding:20px max(16px,env(safe-area-inset-right)) calc(96px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}

/* alapalkki */
.oma-tabs{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:repeat(4,1fr);background:var(--surface);border-top:1px solid var(--line);padding:0 max(6px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(6px,env(safe-area-inset-left))}
.oma-tabs a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;height:62px;color:var(--muted);font:600 11px/1 var(--f);letter-spacing:.01em;text-decoration:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.oma-tabs a .i{width:23px;height:23px;stroke-width:1.7;transition:transform .15s ease}
.oma-tabs a.on{color:var(--ink)}
.oma-tabs a.on .i{color:var(--amber-text);stroke-width:2}
.oma-tabs a.on::before{content:"";position:absolute;top:-1px;left:50%;width:28px;height:3px;margin-left:-14px;border-radius:0 0 3px 3px;background:var(--amber)}
.oma-tabs a:active .i{transform:scale(.9)}
.oma-badge{position:absolute;top:8px;left:50%;margin-left:7px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--amber);color:var(--amber-ink);font:700 11px/18px var(--f);font-style:normal;text-align:center;box-shadow:0 0 0 2px var(--surface)}

/* sivu: näyttämö ja sisältö */
.oma-stage{padding:10px 0 22px;background:var(--brand);color:#fff}
.oma.lift .oma-stage{padding-bottom:60px}
.oma-stage h1{margin:0;font:800 28px/1.12 var(--f);font-stretch:120%;letter-spacing:-.012em;overflow-wrap:anywhere}
.oma-stage p{margin:8px 0 0;max-width:38ch;color:#AEBACD;font-size:15px;line-height:1.45}
.oma-stage p b{color:#fff;font-weight:700;font-variant-numeric:tabular-nums}
.oma-body{display:flex;flex-direction:column;gap:12px;padding-top:16px}
.oma.lift .oma-body{margin-top:-40px;padding-top:0}
.oma.has-bar .oma-body{padding-bottom:78px}
.oma.enter .oma-body{animation:oma-rise .22s cubic-bezier(.2,.7,.2,1)}
@keyframes oma-rise{from{transform:translateY(10px)}to{transform:none}}
@keyframes oma-fade{from{opacity:0}to{opacity:1}}
@keyframes oma-up{from{transform:translateY(100%)}to{transform:none}}
@keyframes oma-pulse{0%{box-shadow:0 0 0 0 rgba(244,165,28,.55)}70%{box-shadow:0 0 0 9px rgba(244,165,28,0)}100%{box-shadow:0 0 0 0 rgba(244,165,28,0)}}
@keyframes oma-shine{from{background-position:120% 0}to{background-position:-120% 0}}
.oma-sec{display:flex;align-items:baseline;gap:8px;margin:12px 4px -3px;font:600 11.5px/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.oma-sec span{letter-spacing:0;font-weight:500;color:var(--faint)}
.oma-note{margin:2px 4px;color:var(--muted);font-size:13.5px;line-height:1.55}
.oma-note .linkbtn{font-size:inherit}
.oma-list{display:flex;flex-direction:column;gap:12px}
.oma-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}
.oma .mono{font-family:var(--f-mono);font-size:12px;letter-spacing:.02em;color:var(--muted)}
.oma .dim{color:var(--muted);font-size:13px}
.oma .lbl{display:inline-flex;align-items:center;gap:8px;font:600 11px/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.oma .lbl.now,.oma-run .lbl{color:var(--amber-text)}
.oma .pulse{flex:none;width:9px;height:9px;border-radius:50%;background:var(--amber);animation:oma-pulse 1.8s ease-out infinite}

/* painikkeet */
.oma-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 18px;border-radius:13px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:700 15.5px/1.1 var(--f);text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;transition:transform .08s ease,background .12s ease,opacity .12s ease}
.oma-btn .i{width:19px;height:19px;stroke-width:2}
.oma-btn:active{transform:scale(.975)}
.oma-btn.pri{background:var(--amber);border-color:var(--amber);color:var(--amber-ink);box-shadow:0 1px 2px rgba(120,70,0,.25),inset 0 1px 0 rgba(255,255,255,.28)}
.oma-btn.pri:active{background:var(--amber-hover)}
.oma-btn.dark{background:var(--brand);border-color:var(--brand);color:#fff}
.oma-btn.dark .i{color:var(--amber)}
.oma-btn.ghost{color:var(--ink-2)}
.oma-btn.crit{background:var(--crit);border-color:var(--crit);color:#fff}
.oma-btn.full{width:100%}
.oma-btn.sm{min-height:38px;padding:0 13px;border-radius:10px;font-size:13.5px}
.oma-btn[disabled]{opacity:.55;cursor:default}
.oma-btn.busy{opacity:.7}
.oma-btn:focus-visible,.oma-tabs a:focus-visible,.oma .day:focus-visible,.oma-row.link:focus-visible,.og-main:focus-visible,.og-next:focus-visible,.oma-back:focus-visible,.oma-chips button:focus-visible,.cal-paint button:focus-visible{outline:3px solid var(--accent-mid);outline-offset:2px}
.oma-ic{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border:0;border-radius:12px;background:transparent;color:var(--ink-2);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.oma-ic .i{width:20px;height:20px}
.oma-ic:active{background:var(--hover)}
.oma-ic .flip,.oma-back .i{transform:rotate(180deg)}

/* tilat */
.oma-pill{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:12px;font:600 12px/1 var(--f);white-space:nowrap}
.oma-pill.wait{background:var(--amber-soft);color:var(--amber-text)}
.oma-pill.ok{background:var(--ok-soft);color:var(--ok)}
.oma-pill.soft{background:var(--accent-soft);color:var(--accent-text)}
.oma-pill.no{background:var(--sunk);color:var(--muted)}
.oma:not(.in-app) .oma-stage .oma-pill.wait{background:var(--amber);color:var(--amber-ink)}
.oma:not(.in-app) .oma-stage .oma-pill.ok{background:rgba(76,195,131,.18);color:#7FE0AC}
.oma:not(.in-app) .oma-stage .oma-pill.soft{background:rgba(255,255,255,.12);color:#DCE4F0}
.oma:not(.in-app) .oma-stage .oma-pill.no{background:rgba(255,255,255,.1);color:#AEBACD}

/* keikat */
.og-main{display:flex;align-items:center;gap:14px;padding:14px 12px 14px 14px;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
.og-main:active,.og-next:active{background:var(--hover)}
.oma a:hover,.oma-top a:hover,.oma-tabs a:hover{text-decoration:none}
.og.ask{border-color:var(--amber);box-shadow:var(--shadow),inset 0 3px 0 var(--amber)}
.og-date{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:54px;height:62px;border-radius:12px;background:var(--brand);color:#fff}
.og-date b{font:800 22px/1 var(--f);font-stretch:116%;font-variant-numeric:tabular-nums}
.og-date span{margin-top:3px;font:700 10px/1 var(--f);text-transform:uppercase;letter-spacing:.08em;color:var(--amber)}
.og-date small{margin-top:4px;font:500 10px/1 var(--f-mono);color:#93A1B8}
.og-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.og-body h3,.og-next h3,.oma-invite h3{margin:0;font:700 16.5px/1.25 var(--f);color:var(--ink);overflow-wrap:anywhere}
.og-body p{margin:0;max-width:100%;font-size:14px;line-height:1.35;color:var(--ink-2);overflow-wrap:anywhere}
.og-body .oma-pill{margin-top:5px}
.og-go{flex:none;width:18px;height:18px;color:var(--faint)}
.og-act{display:grid;grid-template-columns:1fr 1.7fr;gap:10px;padding:2px 14px 14px}
.og-act.one{grid-template-columns:1fr}
.og-list .og+.og{border-top:1px solid var(--line-2)}
.og-list .og-date{width:48px;height:56px;border-radius:11px}
.og-list .og-date b{font-size:20px}
.og-next{position:relative;display:flex;flex-direction:column;gap:5px;padding:16px 40px 16px 16px;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
.og-next-t{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 -24px 4px 0}
.og-next h3{font-size:20px;font-weight:800;font-stretch:112%;letter-spacing:-.005em}
.og-next p{margin:0;font-size:14.5px;line-height:1.4;color:var(--ink-2)}
.og-next p.dim{display:flex;align-items:flex-start;gap:6px;font-size:13.5px}
.og-next p.dim .i{width:15px;height:15px;margin-top:2px;color:var(--faint)}
.og-next .oma-pill{align-self:flex-start;margin-top:5px}
.og-next .og-go{position:absolute;right:14px;top:50%;margin-top:-9px}
.og.next .og-act{padding-top:0}
.oma-invite{padding:16px 16px 0}
.oma-invite .oma-av{margin-bottom:12px}
.oma-invite p{margin:6px 0 14px;color:var(--ink-2);font-size:14px;line-height:1.5}
.oma-invite .og-act{padding:0 0 16px}
.oma-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:34px 22px;border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:var(--shadow);text-align:center;color:var(--muted)}
.oma-empty>.i{width:44px;height:44px;padding:11px;border-radius:14px;background:var(--amber-soft);color:var(--amber-text);margin-bottom:6px}
.oma-empty b{font:700 16.5px/1.3 var(--f);color:var(--ink)}
.oma-empty p{margin:0;font-size:14px;line-height:1.5;max-width:34ch}
.oma-empty .oma-btn{margin-top:10px}
.oma-more summary{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 4px;color:var(--ink-2);font:600 14px/1 var(--f);cursor:pointer;list-style:none;-webkit-tap-highlight-color:transparent}
.oma-more summary::-webkit-details-marker{display:none}
.oma-more summary span{color:var(--faint);font-weight:500}
.oma-more summary .i{margin-left:auto;color:var(--faint);transform:rotate(90deg);transition:transform .15s ease}
.oma-more[open] summary .i{transform:rotate(-90deg)}

/* käynnissä oleva työaika */
.oma-run{display:flex;align-items:center;gap:12px;padding:13px 13px 13px 16px;border-color:var(--amber);box-shadow:var(--shadow),inset 0 3px 0 var(--amber)}
.oma-run>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.oma-run b{font:800 21px/1.1 var(--f);font-stretch:114%;font-variant-numeric:tabular-nums}
.oma-run .dim{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.oma-run .oma-btn{min-height:44px;padding:0 16px}

/* keikan sivu */
.oma-back{display:inline-flex;align-items:center;gap:3px;min-height:40px;margin:-4px 0 2px -8px;padding:0 12px 0 6px;border-radius:10px;color:#AEBACD;font:600 14.5px/1 var(--f);text-decoration:none;-webkit-tap-highlight-color:transparent}
.oma-back .i{width:18px;height:18px}
.oma-back:active{background:rgba(255,255,255,.08)}
.oma-stage .oma-pill{display:flex;width:max-content;margin:4px 0 10px}
.oma-row{display:flex;align-items:center;gap:14px;min-height:62px;padding:10px 14px 10px 16px;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
.oma-row+.oma-row{border-top:1px solid var(--line-2)}
.oma-row>.i:first-child{flex:none;width:21px;height:21px;color:var(--amber-text)}
.oma-row>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.oma-row b{font:600 15.5px/1.3 var(--f);overflow-wrap:anywhere}
.oma-row span{color:var(--muted);font-size:13px;line-height:1.35}
.oma-row.link:active{background:var(--hover)}
.oma-ul{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}
.oma-ul>li{display:flex;align-items:center;gap:12px;min-height:56px;padding:9px 14px 9px 16px}
.oma-ul>li+li{border-top:1px solid var(--line-2)}
.oma-ul>li>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.oma-ul b{font:600 15px/1.3 var(--f);overflow-wrap:anywhere}
.oma-ul span{color:var(--muted);font-size:13px;line-height:1.35}
.oma-ul li.grp{justify-content:space-between;min-height:0;padding:10px 16px 8px;background:var(--surface-2);font:600 11px/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.oma-ul li.grp span{font:inherit;letter-spacing:0;text-transform:none;color:var(--ink-2)}
.oma-ul li.me{background:var(--amber-soft)}
.oma-ul li>i{flex:none;padding:4px 9px;border-radius:10px;background:var(--amber);color:var(--amber-ink);font:700 11px/1.2 var(--f);font-style:normal}
.oma-ul li>i.pk-ok{background:var(--ok-soft);color:var(--ok)}
.oma-ul li>i.pk-part{background:var(--amber-soft);color:var(--amber-text);font-variant-numeric:tabular-nums}
.oma-ul .when{flex:none;display:flex;flex-direction:column;gap:3px;width:78px}
.oma-ul .when b{font:700 14px/1.1 var(--f);font-variant-numeric:tabular-nums;color:var(--ink)}
.oma-ul .when small{font:500 11px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.oma-ul .qty{flex:none;min-width:48px;text-align:right;font:700 14px/1 var(--f);font-variant-numeric:tabular-nums;color:var(--ink)}
.oma-ul.skel li>div{gap:8px}
.oma-ul.skel b,.oma-ul.skel span{display:block;height:12px;border-radius:6px;background:linear-gradient(90deg,var(--sunk) 0%,var(--surface-2) 50%,var(--sunk) 100%);background-size:240% 100%;animation:oma-shine 1.2s linear infinite}
.oma-ul.skel b{width:58%}
.oma-ul.skel span{width:36%;height:10px}
.oma-bar{position:fixed;left:0;right:0;bottom:calc(62px + env(safe-area-inset-bottom));z-index:25;padding:10px 0;background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -10px 24px rgba(15,27,45,.08)}
.oma-bar .oma-in{display:flex;gap:10px}
.oma-bar .oma-btn{flex:1.7}
.oma-bar .oma-btn.ghost{flex:1}

/* kalenteri */
.oma-cal{padding:6px 10px 14px}
.cal-h{display:flex;align-items:center;justify-content:space-between}
.cal-h b{font:800 17px/1 var(--f);font-stretch:114%;text-transform:capitalize}
.cal-paint{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:4px 0 14px;padding:4px;border-radius:13px;background:var(--sunk)}
.cal-paint button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:0 6px;border:0;border-radius:10px;background:transparent;color:var(--ink-2);font:600 13.5px/1 var(--f);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.cal-paint button.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-sm)}
.cal-paint i{width:12px;height:12px;border-radius:4px;border:1px solid var(--line)}
.cal-paint .vapaa i{background:var(--ok);border-color:var(--ok)}
.cal-paint .varattu i{background:repeating-linear-gradient(135deg,var(--muted) 0 2px,transparent 2px 4px);border-color:var(--muted)}
.cal-wd,.cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.cal-wd{margin:0 0 7px}
.cal-wd span{text-align:center;font:600 10.5px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--faint)}
.cal-g .pad{aspect-ratio:1}
.oma .day{position:relative;aspect-ratio:1;min-height:44px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid transparent;border-radius:12px;background:var(--surface-2);color:var(--ink);font:600 15px/1 var(--f);text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background .12s ease,color .12s ease,transform .08s ease}
.oma .day:active{transform:scale(.92)}
.oma .day b{font-weight:600;font-variant-numeric:tabular-nums}
.oma .day.past{background:transparent;color:var(--faint);cursor:default}
.oma .day.past:active{transform:none}
.oma .day.vapaa{background:var(--ok);color:#fff}
.oma .day.vapaa b{font-weight:700}
.oma .day.varattu{background:repeating-linear-gradient(135deg,var(--sunk) 0 5px,var(--surface-2) 5px 10px);border-color:var(--line);color:var(--muted)}
.oma .day.on-gig{background:var(--brand);color:#fff}
.oma .day.on-gig b{font-weight:700}
.oma .day.on-ask{border:2px dashed var(--amber);background:var(--amber-soft);color:var(--amber-text)}
.oma .day i{position:absolute;bottom:6px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--amber)}
.oma .day.on-ask i{display:none}
.oma .day.today{box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--amber)}
.oma .day.past.on-gig{background:var(--sunk);color:var(--muted)}
.oma .day.past.on-ask{border-color:var(--line);background:transparent;color:var(--faint)}
.cal-l{display:flex;flex-wrap:wrap;gap:8px 16px;margin:14px 4px 0;color:var(--muted);font-size:12.5px}
.cal-l span{display:inline-flex;align-items:center;gap:7px}
.cal-l .k{width:13px;height:13px;border-radius:4px}
.cal-l .k.on-gig{background:var(--brand)}
.cal-l .k.on-ask{border:2px dashed var(--amber);background:var(--amber-soft)}
.cal-l .k.today{width:9px;height:9px;margin:0 2px;border-radius:3px;background:var(--surface-2);box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--amber)}

/* tunnit */
.oma-stage .lbl.live{color:var(--amber);margin-top:6px}
.oma-clock{display:block;margin:12px 0 2px;font:800 52px/1 var(--f);font-stretch:112%;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:#fff}
.oma-timer{display:flex;flex-direction:column;gap:12px;padding:16px}
.oma-timer p{margin:0;color:var(--ink-2);font-size:14.5px;line-height:1.5}
.oma-idle{display:flex;align-items:center;gap:14px}
.oma-idle>.i{flex:none;width:44px;height:44px;padding:11px;border-radius:14px;background:var(--sunk);color:var(--muted)}
.oma-idle>div{display:flex;flex-direction:column;gap:3px}
.oma-idle b{font:700 15.5px/1.3 var(--f)}
.oma-idle span{color:var(--muted);font-size:13.5px;line-height:1.4}
.oma-kpi{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.oma-kpi>div{display:flex;flex-direction:column;gap:7px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:var(--shadow)}
.oma-kpi span{color:var(--muted);font-size:12.5px}
.oma-kpi b{font:800 20px/1 var(--f);font-stretch:112%;font-variant-numeric:tabular-nums}
.oma-ul.times>li:not(.grp){padding:0}
.oma-ul.times details{width:100%}
.oma-ul.times summary{display:flex;align-items:center;gap:10px;min-height:58px;padding:9px 12px 9px 16px;cursor:pointer;list-style:none;-webkit-tap-highlight-color:transparent}
.oma-ul.times summary::-webkit-details-marker{display:none}
.oma-ul.times summary>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.oma-ul.times summary .i{color:var(--faint);transform:rotate(90deg);transition:transform .15s ease}
.oma-ul.times details[open] summary .i{transform:rotate(-90deg)}
.oma-ul.times details[open]{background:var(--surface-2)}
.oma-form{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px;padding:4px 16px 16px}
.oma-form.one{grid-template-columns:1fr}
.oma-timer .oma-form,.oma-sheet .oma-form{padding:0}
.oma-form label,.oma-form .flabel{display:flex;flex-direction:column;gap:6px;min-width:0;color:var(--muted);font:600 12.5px/1.2 var(--f)}
.oma-form .wide,.oma-form .og-act,.oma-form .full{grid-column:1/-1}
.oma-form .wide .flabel{margin-bottom:6px}
.oma-form .og-act{padding:2px 0 0}
.oma-form input,.oma-form select{width:100%;min-width:0;height:48px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);font:500 16px/1 var(--f);-webkit-appearance:none;appearance:none}
.oma-form input:focus,.oma-form select:focus{outline:3px solid var(--accent-mid);outline-offset:1px;border-color:var(--accent)}
.oma-form input::placeholder{color:var(--faint)}
/* Tauko valitaan napeista; numerokenttä jää ruudunlukijalle ja muille arvoille */
.oma-timer .oma-form label:has([data-f=break]){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.oma-chips{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr;gap:6px}
.oma-chips button{min-height:44px;padding:0 4px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--ink-2);font:600 13.5px/1 var(--f);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.oma-chips button.on{border-color:var(--ink);background:var(--ink);color:var(--surface)}

/* minä */
.oma-me{display:flex;align-items:center;gap:16px;padding-top:6px}
.oma-me>div{min-width:0}
.oma-me h1{font-size:24px}
.oma-me p{margin-top:4px;overflow-wrap:anywhere}

/* alhaalta nouseva ikkuna */
body.oma-lock{overflow:hidden}
.oma-sheet{position:fixed;inset:0;z-index:95;display:flex;align-items:flex-end;justify-content:center}
.oma-scrim{position:absolute;inset:0;background:var(--scrim);animation:oma-fade .18s ease-out}
.oma-sheet>section{position:relative;width:100%;max-width:560px;max-height:92dvh;overflow:auto;padding:10px max(18px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));border-radius:22px 22px 0 0;background:var(--surface);color:var(--ink);box-shadow:var(--shadow-lg);outline:none;animation:oma-up .24s cubic-bezier(.2,.8,.2,1)}
.oma-sheet .grab{display:block;width:38px;height:4px;margin:0 auto 16px;border-radius:2px;background:var(--line)}
.oma-sheet h2{margin:0 0 6px;font:800 20px/1.2 var(--f);font-stretch:114%}
.oma-sheet-sub{margin:0 0 16px;color:var(--muted);font-size:14px;line-height:1.5}
.oma-sheet-sub b{color:var(--ink);font-weight:600}

/* sama näkymä tavallisen rungon sisällä (crew-listalle liitetty omistaja tai työntekijä) */
.oma.in-app{max-width:640px}
.oma.in-app .oma-in{max-width:none;margin:0;padding:0}
.oma.in-app .oma-seg{display:inline-flex;margin-bottom:16px}
.oma-seg a{display:inline-flex;align-items:center;height:30px;padding:0 13px;border-radius:6px;color:var(--ink-2);font:600 13px/1 var(--f);text-decoration:none}
.oma-seg a.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-sm)}
.oma.in-app .oma-stage{padding:0;background:none;color:var(--ink)}
.oma.in-app .oma-stage p{color:var(--muted)}
.oma.in-app .oma-stage p b,.oma.in-app .oma-clock{color:var(--ink)}
.oma.in-app .oma-stage .lbl.live{color:var(--amber-text)}
.oma.in-app .oma-back{color:var(--ink-2)}
.oma.in-app .oma-body,.oma.in-app.lift .oma-body{margin-top:0;padding-top:18px}
.oma.in-app .oma-bar{position:sticky;bottom:12px;margin-top:16px;padding:10px 12px;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg)}
.oma.in-app.has-bar .oma-body{padding-bottom:0}

@media (min-width:720px){
  .oma-tabs{left:50%;right:auto;bottom:16px;width:440px;margin-left:-220px;padding:0 6px;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg)}
  .oma-bar{left:50%;right:auto;bottom:92px;width:560px;margin-left:-280px;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg)}
  .oma-main{padding-bottom:110px}
  .oma-stage{padding-top:22px}
  .oma-sheet{align-items:center}
  .oma-sheet>section{border-radius:22px;padding-bottom:18px}
  .oma-sheet .grab{display:none}
  .oma-sheet h2{margin-top:10px}
}
@media (prefers-reduced-motion:reduce){
  .oma-btn,.oma .day,.oma-tabs a .i{transition:none}
  .oma.enter .oma-body,.oma-scrim,.oma-sheet>section,.oma .pulse,.oma-ul.skel b,.oma-ul.skel span{animation:none}
}

/* Crew-sovelluksessa ilmoitukset tulevat alas peukalon lähelle, eikä chat-painike peitä päätoimintoja (chat avataan Minä-sivulta) */
body.oma-only .toasts{top:auto;left:16px;right:16px;bottom:calc(74px + env(safe-area-inset-bottom));max-width:none;align-items:center}
body.oma-only:has(.oma-bar) .toasts{bottom:calc(146px + env(safe-area-inset-bottom))}
body.oma-only .toast{max-width:420px;padding:13px 16px;border-radius:13px;font-size:14.5px}
body.oma-only #chatw>.chat-fab{display:none}

/* ---------- Backstagen omat osat ---------- */
body{margin:0}
.bs-auth .auth-line{margin:0;color:var(--ink-2);font-size:15px;line-height:1.5}
/* tapahtuman aikataulu */
.bs-prog .when{width:64px}
.bs-prog li>div span.bs-n{color:var(--ink-2)}
/* pakkaus ja palautus */
.bs-seg{display:grid;grid-template-columns:1fr 1fr;width:100%;padding:4px;border-radius:13px;box-shadow:var(--shadow)}
.bs-seg button{height:44px;border-radius:10px;font-size:15px;color:var(--ink-2);-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.bs-seg button.on{background:var(--brand);color:#fff}
.bs-scan{display:flex;flex-direction:column;gap:12px;padding:16px}
.bs-scan .oma-chips{grid-template-columns:repeat(3,1fr)}
.bs-prog-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.bs-prog-h b{font:800 24px/1 var(--f);font-stretch:114%;font-variant-numeric:tabular-nums}
.bs-bar{height:8px;border-radius:4px;background:var(--sunk);overflow:hidden}
.bs-bar i{display:block;height:100%;border-radius:4px;background:var(--amber);transition:width .25s ease}
.bs-code{display:grid;grid-template-columns:1fr 64px auto;gap:8px}
.bs-code input{min-width:0;height:46px;padding:0 12px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--ink);font:500 16px/1 var(--f)}
.bs-code input[data-f=qty]{text-align:center;font-variant-numeric:tabular-nums}
.bs-code .oma-btn{min-height:46px;padding:0 14px}
.bs-msg:empty{display:none}
.bs-msg span{display:flex;align-items:flex-start;gap:8px;padding:11px 12px;border-radius:11px;font-size:14.5px;line-height:1.4}
.bs-msg .i{flex:none;width:18px;height:18px;margin-top:1px}
.bs-msg .ok{background:var(--ok-soft);color:var(--ok)}
.bs-msg .bad{background:var(--crit-soft);color:var(--crit)}
.bs-pk li.done{background:var(--surface-2)}
.bs-pk li.done b{color:var(--muted)}
.oma-ul li>i.pk-none{background:var(--sunk);color:var(--muted);font-variant-numeric:tabular-nums}
.bs-recent .oma-btn .i{width:16px;height:16px}
.oma-body>.oma-btn.dark{margin-top:2px}
@media (min-width:720px){
  .bs-code{grid-template-columns:1fr 80px auto}
}