/* ui30 — shared UI consistency + responsive layer (29 Oct 2026). Breakpoints: 480 phone portrait, 768 phone landscape / tablet portrait, 1024 tablet landscape, short-landscape (max-height 500). */
.muted{color:var(--mut)}
.danger,.txt-red{color:var(--red)}.txt-ok{color:var(--ok)}.txt-warn{color:var(--warn)}
.pagehead{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.75rem}
.pagehead h1{margin:.25rem 0;flex:1 1 260px}.pagehead .actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-left:auto}
.sub{color:var(--mut);margin:-.6rem 0 1rem}
.backlink{margin:.1rem 0 .4rem}.backlink a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
.actions-bar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.75rem 0}
.formfoot{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
th.act,td.act{text-align:right;white-space:nowrap}
.alertcard{border-left:4px solid var(--red);background:#fde8e8}
.u30bar{background:var(--line);border-radius:6px;height:12px;max-width:520px}.u30bar>div{height:12px;border-radius:6px;background:var(--ok)}
.card h2:first-child,.card h3:first-child{margin-top:0}
img,video,canvas{max-width:100%;height:auto}pre{overflow-x:auto;max-width:100%}
main{overflow-wrap:break-word}
select{max-width:100%}
@media(max-width:1024px){main{padding:1rem .6rem 4rem}.grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
@media(max-width:768px){
 main table:not(.keep){display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
 .tw table{display:table}
 .pagehead .actions,.actions-bar,.formfoot{width:100%}
 .actions-bar>.btn,.actions-bar>button,.formfoot>.btn,.formfoot>button,.pagehead .actions>.btn,.pagehead .actions>button{flex:1 1 auto}
 .filterbar{position:static}
 h1{font-size:1.25rem}
}
@media(max-width:480px){
 .grid{grid-template-columns:1fr}
 .row>input:not([type=checkbox]):not([type=radio]),.row>select{flex:1 1 100%}
 .filterbar .fb-row>*{flex:1 1 100%}
}
@media(orientation:landscape) and (max-height:500px){
 header{position:static}.filterbar{position:static}
 main{padding-top:.5rem}h1{margin-bottom:.5rem}
}
@media print{.pagehead .actions,.actions-bar,.backlink,.formfoot{display:none!important}main table:not(.keep){display:table}}
/* === Glass UI skin (batch 4, 2026-10-29) === */
@media screen{
body{background:radial-gradient(1200px 600px at 10% -10%,#fbe9e4 0,transparent 60%),radial-gradient(900px 500px at 100% 0,#f3ede4 0,transparent 55%),var(--bg);background-attachment:fixed}
header{background:linear-gradient(135deg,rgba(155,28,28,.94),rgba(125,21,21,.9));box-shadow:0 4px 18px rgba(80,10,10,.18)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
header{-webkit-backdrop-filter:saturate(160%) blur(12px);backdrop-filter:saturate(160%) blur(12px)}
.card,.hub-tile{background:rgba(255,255,255,.78);-webkit-backdrop-filter:saturate(150%) blur(14px);backdrop-filter:saturate(150%) blur(14px)}
}
.card{border:1px solid rgba(255,255,255,.7);border-radius:16px;box-shadow:0 1px 2px rgba(31,35,40,.05),0 8px 24px rgba(31,35,40,.07)}
.hub-tile{border-radius:18px!important;border:1px solid rgba(255,255,255,.75)!important;background-image:linear-gradient(160deg,rgba(255,255,255,.92),rgba(250,240,236,.7))!important;box-shadow:0 2px 4px rgba(31,35,40,.05),0 12px 30px rgba(31,35,40,.09)!important}
button,.btn,[type=submit]{border-radius:10px}
.flash{border-radius:12px;box-shadow:0 6px 18px rgba(31,35,40,.08)}
input,select,textarea{border-radius:10px}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 3px rgba(155,28,28,.18)}
}
@media screen and (prefers-reduced-motion:no-preference){
main{animation:gl-fade .35s ease-out both}
@keyframes gl-fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.hub-tile,button,.btn,[type=submit]{transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}
.hub-tile:hover{transform:translateY(-3px);box-shadow:0 4px 8px rgba(31,35,40,.06),0 18px 40px rgba(31,35,40,.14)!important}
button:not(.sec):hover,.btn:not(.sec):hover,[type=submit]:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(155,28,28,.22)}
button:active,.btn:active,.hub-tile:active{transform:translateY(0) scale(.98)}
}
@media print{body{background:#fff!important}header,.card,.hub-tile{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important;background-image:none!important}main{animation:none!important}}

/* ===== glass2 (29 Oct 2026): richer iOS/macOS glass, springy touch, iPad targets ===== */
@media screen{
:root{--g2-bg:rgba(255,255,255,.62);--g2-brd:rgba(255,255,255,.55);--g2-sh:0 1px 2px rgba(0,0,0,.05),0 8px 24px rgba(0,0,0,.08),0 24px 48px rgba(0,0,0,.06);--g2-spring:cubic-bezier(.34,1.56,.64,1)}
body{background-image:radial-gradient(1200px 600px at 10% -10%,rgba(192,57,43,.10),transparent 60%),radial-gradient(900px 500px at 110% 10%,rgba(230,126,34,.10),transparent 60%),radial-gradient(800px 600px at 50% 120%,rgba(39,174,96,.07),transparent 60%);background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.card,.hub-tile,#hubedit,.panel{background:var(--g2-bg)!important;-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);border:1px solid var(--g2-brd)!important;box-shadow:var(--g2-sh),inset 0 1px 0 rgba(255,255,255,.7);border-radius:18px}
.hub-tile{min-height:140px;border-radius:22px;transition:transform .35s var(--g2-spring),box-shadow .3s ease;-webkit-tap-highlight-color:transparent}
.hub-tile .ic{filter:drop-shadow(0 4px 8px rgba(0,0,0,.15));transition:transform .35s var(--g2-spring)}
.hub-tile:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 2px 4px rgba(0,0,0,.06),0 16px 40px rgba(0,0,0,.14)}
.hub-tile:hover .ic{transform:scale(1.12)}
.hub-tile:active,.btn:active{transform:scale(.96);transition-duration:.12s}
.hub-grid{gap:1rem!important;padding:.25rem}
.btn,button,select,input[type=submit]{min-height:44px;border-radius:12px;transition:transform .25s var(--g2-spring),box-shadow .2s,filter .2s}
.btn:hover{filter:brightness(1.05);box-shadow:0 6px 16px rgba(0,0,0,.12)}
.hub-btn{min-width:44px!important;min-height:44px!important}
#hublist li{min-height:52px;background:rgba(255,255,255,.7)!important;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
table{background:rgba(255,255,255,.9)}
input,select,textarea{background:rgba(255,255,255,.92)}
}
@media (hover:none){.hub-tile:hover{transform:none}.hub-tile:hover .ic{transform:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.hub-tile:hover,.hub-tile:active,.btn:active{transform:none!important}}
@media print{body{background:#fff!important}body::before{display:none}.card,.hub-tile,.panel{box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#fff!important}}

/* navfx: menu + logo pop */
@media screen{
header{transition:box-shadow .3s ease,background-color .3s ease,backdrop-filter .3s ease}
header.scrolled{box-shadow:0 8px 28px rgba(0,0,0,.28);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px)}
header .brand{display:inline-block;transform-origin:left center;transition:transform .35s cubic-bezier(.34,1.56,.64,1),text-shadow .35s ease}
header .brand:hover,header .brand:focus-visible{transform:scale(1.14) translateY(-1px);text-shadow:0 4px 14px rgba(255,180,80,.55)}
header .brand:active{transform:scale(1.06);transition-duration:.12s}
nav a,nav .navbtn{display:inline-block;transition:transform .28s cubic-bezier(.34,1.56,.64,1),box-shadow .28s ease,background-color .2s ease;will-change:transform}
nav a:hover,nav a:focus-visible,nav .navbtn:hover,nav .navbtn:focus-visible{transform:scale(1.08) translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.22);position:relative;z-index:2}
nav a:active,nav .navbtn:active{transform:scale(.95);transition-duration:.1s}
nav a.touchpop,nav .navbtn.touchpop{transform:scale(1.08) translateY(-2px)}
}
@media (prefers-reduced-motion:reduce){header .brand,nav a,nav .navbtn,header{transition:none!important}header .brand:hover,nav a:hover,nav .navbtn:hover,nav a.touchpop,nav .navbtn.touchpop{transform:none!important}}

/* navscroll: any tall dropdown/menu scrolls inside the viewport */
nav .navmenu,.navmenu,.dropdown-menu,.nav-dropdown,[role="menu"]{max-height:min(75vh,calc(100vh - 7rem));max-height:min(75dvh,calc(100dvh - 7rem));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;z-index:50}
nav .navgrp.open .navmenu{flex-wrap:nowrap}
nav .navmenu a{flex-shrink:0}

/* nav34 boss menu: short bars on phone (<700) and iPad (700-999); laptop >=1000 uses the full bar */
nav.cnav{display:none}
@media(max-width:999px){
 body:has(nav.cnav) #menubtn{display:none!important}
 body:has(nav.cnav) nav:not(.cnav){display:none!important}
 nav.cnav{display:block}
 nav.cnav .grp{flex-wrap:wrap;gap:.15rem;padding:.3rem .4rem}
 nav.cnav a,nav.cnav .navbtn{padding:.55rem .6rem}
 nav.cnav .navgrp{display:inline-block;position:relative}
 nav.cnav .navmenu{position:absolute;right:auto;box-shadow:0 8px 20px rgba(0,0,0,.25)}
 nav.cnav .navgrp:last-child .navmenu{left:auto;right:0}
 nav.cnav .c-ph:not(.c-ip),nav.cnav .c-ip:not(.c-ph){display:none!important}
}
@media(max-width:699px){nav.cnav a.c-ph:not(.c-ip){display:inline-flex!important}nav.cnav .navgrp.c-ph:not(.c-ip){display:inline-block!important}}
@media(min-width:700px) and (max-width:999px){nav.cnav a.c-ip:not(.c-ph){display:inline-flex!important}nav.cnav .navgrp.c-ip:not(.c-ph){display:inline-block!important}}

/* navgroup 29 Oct: menus above page content on all layouts; group label opens list page */
header{position:relative;z-index:1000}
nav,nav.cnav{position:relative;z-index:999}
nav .navgrp{display:inline-flex!important;align-items:stretch;position:relative}
nav .navlbl{padding-right:.3rem!important}
nav .navcaret{padding:.55rem .45rem!important;min-width:32px;justify-content:center}
nav .navmenu{position:absolute!important;top:100%;left:0;z-index:1001;max-height:calc(100vh - 150px);max-height:calc(100dvh - 150px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:#7d1515!important;opacity:1;box-shadow:0 10px 28px rgba(0,0,0,.4)!important}
nav .navgrp:last-child .navmenu{left:auto;right:0}
@media(max-width:999px){nav .navcaret{display:none!important}nav .navgrp .navmenu{display:none!important}nav .navlbl{padding-right:.6rem!important}nav .navlbl::after{content:" \203A";opacity:.7}}
.navpage{list-style:none;padding:0;margin:1rem 0;display:grid;gap:.6rem;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.navpage a{display:flex;align-items:center;min-height:56px;padding:.9rem 1.1rem;border-radius:12px;background:#7d1515;color:#fff;text-decoration:none;font-size:1.1rem;font-weight:600}
.navpage a.act{outline:3px solid #f5b800}