.demo-body { background: #071018; }.demo-shell { max-width: 74rem; margin: auto; padding: clamp(1rem, 3vw, 2.25rem); }.demo-controls { display:flex; justify-content:space-between; gap:1.5rem; align-items:center; margin-bottom:1.5rem; }.demo-controls h1 { font-size:clamp(1.5rem,3vw,2.3rem); }.demo-controls p { margin:.4rem 0 0; color:#b7cddc; }.control-group { display:flex; flex-wrap:wrap; gap:.55rem; align-items:center; color:#bed9e9; }.choice { padding:.65rem .85rem; border:1px solid #54788e; border-radius:.55rem; background:#102535; color:#e8f7ff; }.choice.active { border-color:#89dcff; background:#18516d; box-shadow:0 0 0 .15rem rgba(137,220,255,.15); }.signage { aspect-ratio:4/3; min-height:30rem; display:flex; flex-direction:column; overflow:hidden; border:clamp(.5rem,1vw,.9rem) solid #1c2932; border-radius:1.1rem; background:#f8fbfc; color:#0a1720; box-shadow:0 1.5rem 3rem rgba(0,0,0,.35); }.signage-header,.signage-footer { display:flex; justify-content:space-between; align-items:center; padding:clamp(.8rem,2vw,1.35rem) clamp(1rem,3vw,2rem); background:#0e2a3a; color:#fff; }.signage-header strong { display:block; font-size:clamp(1.3rem,3vw,2.25rem); }.signage-header span { color:#bfe6f7; font-size:clamp(.6rem,1.2vw,.85rem); letter-spacing:.13em; }.clock { font-variant-numeric:tabular-nums; font-size:clamp(1rem,2vw,1.45rem); }.signage-list { flex:1; display:grid; padding:clamp(.65rem,1.8vw,1.4rem) clamp(1rem,3vw,2rem); align-content:stretch; }.signage-list.four { grid-template-rows:repeat(4,1fr); }.signage-list.six { grid-template-rows:repeat(6,1fr); }.signage-company { display:flex; align-items:center; justify-content:center; padding:.35rem .5rem; border-bottom:1px solid #bdcbd3; text-align:center; font-size:clamp(1.1rem,2.8vw,2.1rem); font-weight:700; line-height:1.25; }.six .signage-company { font-size:clamp(.88rem,2.05vw,1.55rem); }.signage-company:last-child { border-bottom:0; }.signage-company span { display:block; margin-top:.15rem; color:#2d566c; font-size:.72em; font-weight:500; }.signage-footer { color:#d8edf6; font-size:clamp(.72rem,1.6vw,1rem); }.demo-note { max-width:70rem; margin:1.2rem auto 0; color:#c5dce9; line-height:1.6; }.demo-note strong { color:#fff; } @media (max-width:40rem) { .demo-controls { align-items:flex-start; flex-direction:column; }.signage { min-height:0; }.signage-header,.signage-footer { padding:.65rem .8rem; } }

/* 正式水牌顯示：全屏、沒有任何示範控制或說明。 */
.demo-body { min-height: 100vh; }
.signage-shell { min-height: 100vh; padding: clamp(.5rem, 1.5vw, 1.25rem); }
.signage-shell .signage { aspect-ratio: auto; min-height: calc(100vh - clamp(1rem, 3vw, 2.5rem)); border-radius: .8rem; }
.signage-shell .signage-footer { min-height: 3rem; }