:root {
  color-scheme: dark;
  --cream: #f1e9d9;
  --blue: #a5bcd6;
  --text: #eee9e2;
  --muted: #bfb7ad;
  --brown: #231815;
  --red: #4d0e12;
  --line: rgba(241,233,217,.14);
  --board-art: url('assets/elf-portrait-display-1920.webp');
  --glass: linear-gradient(145deg,rgba(241,233,217,.055),rgba(165,188,214,.018)),rgba(28,25,27,.72);
  --ease: cubic-bezier(.2,.65,.3,1);
}
* { box-sizing: border-box; }
html,body { width:100%; height:100%; overflow:hidden; overscroll-behavior:none; }
body { margin:0; background:#1b1718; color:var(--text); font-family:'Golos Text',Arial,sans-serif; -webkit-font-smoothing:antialiased; isolation:isolate; }
body::before { content:''; position:fixed; inset:-45px; z-index:-2; background:linear-gradient(#23181560,#231815a8),var(--board-art) center/cover; filter:blur(32px); opacity:.8; pointer-events:none; }
body::after { content:''; position:fixed; inset:0; z-index:-1; background:radial-gradient(ellipse at 90% 0,#4d0e1240,transparent 60%); pointer-events:none; }
h1,h2,h3,p { margin:0; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.38; translate:0; transform:none; }
button,a { -webkit-tap-highlight-color:transparent; }
button:not(:disabled),a { transition:background-color .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),box-shadow .3s var(--ease),transform .3s var(--ease),translate .3s var(--ease); }
:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
@media(max-width:767px) { :root { --board-art:url('assets/elf-portrait-display-960.webp'); } }
@supports(background-image:image-set(url('assets/elf-portrait-display-960.webp') 1x)) {
  @media(max-width:767px) { :root { --board-art:image-set(url('assets/elf-portrait-display-960.webp') 1x,url('assets/elf-portrait-display-1920.webp') 2x); } }
}
::selection { color:#231815; background:#a5bcd6; }
[hidden] { display:none!important; }
.ui-icon { width:18px; height:18px; flex-shrink:0; display:block; stroke-width:1.7; }
[data-ui-icon] { display:inline-flex; flex-shrink:0; }

.board-shell { width:min(1530px,calc(100% - 48px)); height:calc(100dvh - 32px); margin:16px auto; display:grid; grid-template-rows:24px minmax(0,1fr) 24px; gap:12px; }
.outside-header,.outside-footer { display:flex; align-items:center; justify-content:space-between; gap:16px; min-width:0; color:#bcb0a4; font-size:11px; line-height:1.5; }
.outside-header>span:first-child { font-size:9px; font-weight:500; letter-spacing:1.8px; }
.outside-header>span:last-child { color:#c8bcb0; font-size:11px; letter-spacing:.2px; }
.outside-footer { font-size:10px; color:#a99d92; }
.outside-footer>span:last-child { font-size:8px; letter-spacing:1.6px; }
.mode-pill { display:inline-flex; gap:6px; align-items:center; color:#c6c0b7; }
.mode-pill .ui-icon { width:13px; height:13px; color:var(--blue); }

.board-frame { position:relative; isolation:isolate; min-height:0; overflow:hidden; border-radius:28px; border:1px solid rgba(241,233,217,.15); background:#231815; box-shadow:0 24px 72px rgba(9,8,10,.34),inset 0 1px 0 rgba(241,233,217,.07); display:grid; grid-template-rows:76px minmax(0,1fr); }
.board-frame::after { content:''; position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,#0c101419,#13131010 45%,#0d11153b),var(--board-art) center center/cover no-repeat; pointer-events:none; }
.board-frame::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,#10111442,transparent 30%,transparent 70%,#10111430); pointer-events:none; }
.board-header { display:flex; align-items:center; justify-content:space-between; min-width:0; padding:0 28px; gap:24px; border-bottom:1px solid rgba(241,233,217,.075); background:linear-gradient(180deg,rgba(25,22,24,.64),rgba(25,22,24,.22)); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.board-brand { display:flex; align-items:baseline; gap:12px; flex-shrink:0; color:var(--cream); font-family:'Cormorant Garamond',Georgia,serif; font-size:32px; line-height:1; letter-spacing:-1px; }
.board-brand>span { font-family:'Golos Text',Arial,sans-serif; color:#bbb1a4; font-size:11px; letter-spacing:0; }
.board-nav { display:flex; align-items:center; gap:6px; margin-right:auto; min-width:0; }
.board-nav button { min-height:38px; padding:8px 13px; border:1px solid transparent; background:transparent; color:#c4beb7; font-size:12px; font-weight:500; white-space:nowrap; }
.board-nav .ui-icon { width:16px; height:16px; }
.board-nav .nav-active { background:rgba(241,233,217,.1); border-color:rgba(241,233,217,.13); color:var(--cream); box-shadow:inset 0 1px 0 rgba(241,233,217,.04); }
.header-twitch { min-height:40px; padding:9px 15px; gap:9px; border:1px solid rgba(241,233,217,.2); color:var(--cream); background:rgba(241,233,217,.045); font-size:12px; font-weight:500; white-space:nowrap; }
.header-twitch [data-ui-icon]:last-child .ui-icon { width:15px; height:15px; color:#bdb4a7; }

.board-surface { position:relative; min-height:0; width:100%; height:100%; overflow:hidden; isolation:isolate; }
.board-caption { position:absolute; left:3.6%; top:5%; max-width:30%; pointer-events:none; color:var(--cream); text-shadow:0 2px 20px rgba(16,17,20,.45); }
.board-caption>span { font-size:8px; font-weight:500; letter-spacing:1.7px; color:#d2c6b6; }
.board-caption h1 { margin-top:12px; font-family:'Cormorant Garamond',Georgia,serif; font-size:clamp(30px,3.1vw,48px); line-height:1.04; font-weight:400; letter-spacing:-.9px; text-wrap:balance; }
.board-empty { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:12px; max-width:90%; padding:28px; border:1px solid var(--line); background:var(--glass); color:var(--muted); font-size:14px; text-align:center; }
.board-empty .ui-icon { width:28px; height:28px; color:var(--blue); }

.board-widget { position:absolute; display:flex; flex-direction:column; min-width:0; min-height:0; border:1px solid rgba(241,233,217,.15); border-radius:22px; background:var(--glass); box-shadow:inset 0 1px 0 rgba(241,233,217,.045),0 12px 32px rgba(9,8,10,.18); backdrop-filter:blur(20px) saturate(.9); -webkit-backdrop-filter:blur(20px) saturate(.9); color:var(--text); overflow:hidden; container-type:size; transition:background-color .3s var(--ease),border-color .3s var(--ease),box-shadow .3s var(--ease),transform .3s var(--ease); }
.widget-content { display:flex; flex-direction:column; min-height:0; flex:1; padding:18px 20px; gap:10px; }
.widget-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0; flex-shrink:0; }
.widget-heading h2 { min-width:0; font-size:13px; font-weight:500; line-height:1.4; letter-spacing:-.15px; color:#e1dbd1; }
.widget-heading .widget-icon { display:inline-flex; color:#b8bbbd; flex-shrink:0; }
.widget-heading .ui-icon { width:17px; height:17px; }
.widget-label { font-size:11px; line-height:1.5; color:var(--muted); }
.widget-note { font-size:12px; line-height:1.5; color:#bab3aa; }
.widget-main { font-size:clamp(22px,8cqw,30px); line-height:1.16; font-weight:500; letter-spacing:-.8px; color:var(--cream); text-wrap:balance; }
.next-copy { display:flex; flex-direction:column; justify-content:center; flex:1; min-height:0; gap:6px; }
.widget-date { display:flex; align-items:baseline; gap:14px; font-variant-numeric:tabular-nums; }
.widget-date strong { font-weight:600; font-size:clamp(26px,8.5cqw,34px); line-height:1.1; letter-spacing:-1px; color:var(--cream); }
.widget-date>span { font-size:13px; font-weight:400; color:#d5cdbf; }
.widget-games { font-size:13px; line-height:1.5; color:#d3ccbf; }
.widget-link { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:28px; width:100%; padding:8px 0 0; margin-top:auto; border:0; border-top:1px solid rgba(241,233,217,.11); border-radius:0; background:transparent; color:#cfc5b5; text-align:left; flex-shrink:0; }
.widget-link-label { font-size:12px; font-weight:500; line-height:1.4; }
.widget-link-icon { display:flex; flex-shrink:0; }
.widget-link .ui-icon { width:16px; height:16px; }
.widget-film-layout { display:grid; grid-template-columns:minmax(65px,.7fr) minmax(0,1fr); gap:16px; align-items:center; flex:1; min-height:0; }
.widget-poster { position:relative; display:grid; place-items:center; min-height:0; height:100%; max-height:205px; border-radius:15px; border:1px solid rgba(241,233,217,.11); background:radial-gradient(ellipse at 25% 15%,rgba(165,188,214,.16),transparent 75%),linear-gradient(145deg,rgba(77,14,18,.34),rgba(35,24,21,.74)); overflow:hidden; }
.widget-poster img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.film-placeholder { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; border:1px solid rgba(241,233,217,.22); color:#e1d9cd; background:rgba(241,233,217,.035); }
.film-placeholder .ui-icon { width:20px; height:20px; }
.film-copy { display:flex; flex-direction:column; gap:10px; min-width:0; }
.film-copy h3 { font-size:clamp(23px,7.5cqw,30px); line-height:1.12; letter-spacing:-.8px; font-weight:500; color:var(--cream); overflow-wrap:anywhere; text-wrap:balance; }
.film-genre { font-size:9px; font-weight:500; line-height:1.5; letter-spacing:1.1px; text-transform:uppercase; color:#b8c4cb; }
.film-copy .widget-note { font-size:11px; line-height:1.55; }
.channels-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; align-items:center; flex:1; min-height:0; }
.channel-link { display:flex; align-items:center; min-width:0; gap:10px; border-radius:10px; }
.channel-link+.channel-link { padding-left:16px; border-left:1px solid rgba(241,233,217,.12); border-top-left-radius:0; border-bottom-left-radius:0; }
.channel-link b { font-size:13px; font-weight:500; line-height:1.4; color:#e4ddd3; }
.channel-link small { display:block; margin-top:3px; font-size:11px; line-height:1.4; color:#b7afa4; overflow-wrap:anywhere; }
.channel-avatar { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; border:1px solid rgba(241,233,217,.12); background:rgba(241,233,217,.045); color:#d8d3cc; flex-shrink:0; transition:background-color .3s,border-color .3s; }
.channel-avatar .ui-icon { width:17px; height:17px; }
.channel-link.disabled { opacity:.48; }
.setup-mini { display:flex; align-items:center; flex:1; min-height:0; gap:12px; }
.setup-mini img { width:76px; height:54px; object-fit:contain; flex-shrink:0; }
.setup-mini p { font-size:13px; line-height:1.5; font-weight:500; color:#ddd5c8; }
.setup-mini small { display:block; font-size:11px; line-height:1.5; font-weight:400; color:#b9b2a7; }
.widget-schedule { display:flex; flex-direction:column; flex:1; min-height:0; gap:0; overflow:hidden; }
.widget-stream-row { display:grid; grid-template-columns:65px 48px minmax(0,1fr); gap:10px; align-items:center; min-height:30px; padding:7px 0; border-top:1px solid rgba(241,233,217,.08); font-size:11px; line-height:1.5; }
.widget-stream-row:first-child { border:0; }
.widget-stream-row>span:last-child { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:11px; color:#bcb5a9; }
.widget-stream-row time { font-variant-numeric:tabular-nums; color:var(--cream); }

.editor-toolbar { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.editor-toolbar button,.control-button { min-height:40px; padding:9px 14px; border:1px solid rgba(241,233,217,.18); background:rgba(241,233,217,.045); color:var(--cream); font-size:12px; font-weight:500; white-space:nowrap; }
.editor-toolbar #undo-widget { width:40px; padding:9px; }
.editor-toolbar #export-board { background:#e4dac4; color:#2b2421; border-color:#e4dac4; box-shadow:0 4px 12px rgba(9,8,10,.12); }
.editor-toolbar .ui-icon { width:16px; height:16px; }
.widget-edit-controls { position:absolute; top:14px; right:14px; z-index:3; display:flex; gap:5px; }
.widget-edit-controls button { display:grid; place-items:center; width:28px; height:28px; border:1px solid rgba(241,233,217,.15); border-radius:8px; background:rgba(36,32,34,.76); color:#bfb8ae; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.widget-edit-controls .ui-icon { width:15px; height:15px; }
[data-drag-handle] { touch-action:none; cursor:grab; }
[data-drag-handle]:active { cursor:grabbing; }
.board-widget.is-dragging { z-index:30; border-color:rgba(165,188,214,.8); box-shadow:0 18px 48px rgba(9,8,10,.4); user-select:none; }
.board-widget:focus-within { z-index:5; }
body[data-layout-editor=true] .board-widget { border-color:rgba(241,233,217,.21); transition:border-color .3s,box-shadow .3s; }
body[data-layout-editor=true] .widget-content { padding-top:16px; }
body[data-layout-editor=true] .widget-heading { min-height:28px; padding-right:66px; }
body[data-layout-editor=true] .widget-heading>.widget-icon { display:none; }
body[data-layout-editor=true] .board-surface { background-image:radial-gradient(rgba(241,233,217,.11) .6px,transparent .8px); background-size:24px 24px; }
body[data-layout-editor=true] .board-caption { opacity:.65; }
.editor-status { max-width:min(760px,80vw); overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:10px; line-height:1.5; color:#baad9b; }
.mobile-pager { display:flex; align-items:center; gap:10px; }
.mobile-pager button { width:32px; height:30px; padding:0; border:1px solid var(--line); background:rgba(241,233,217,.06); color:var(--cream); }
.mobile-pager .ui-icon { width:16px; height:16px; }
.mobile-pager>span { min-width:34px; text-align:center; font-size:11px; font-variant-numeric:tabular-nums; color:#d0c4b3; }

dialog { margin:auto; padding:28px; border:1px solid rgba(241,233,217,.2); border-radius:24px; color:var(--text); background:linear-gradient(145deg,rgba(47,42,44,.96),rgba(28,26,29,.98)); box-shadow:0 28px 90px rgba(9,8,10,.45); backdrop-filter:blur(28px); -webkit-backdrop-filter:blur(28px); }
dialog::backdrop { background:rgba(17,16,20,.66); backdrop-filter:blur(8px); }
dialog h2 { font-size:25px; font-weight:500; line-height:1.2; letter-spacing:-.6px; color:var(--cream); }
dialog>header { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:24px; flex-shrink:0; }
.circle-button { width:36px; height:36px; padding:0; border:1px solid var(--line); background:rgba(241,233,217,.05); color:#cfc6b9; flex-shrink:0; }
#widget-dialog { width:min(440px,calc(100% - 28px)); }
.widget-form-label { display:flex; flex-direction:column; gap:12px; margin:24px 0 28px; color:#cec6bc; font-size:13px; }
select { width:100%; min-height:46px; padding:12px 14px; border:1px solid rgba(241,233,217,.2); border-radius:12px; background:#302b2e; color:var(--cream); font-size:14px; }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; }
.dialog-actions button { min-height:42px; padding:10px 18px; border:1px solid var(--line); color:var(--cream); background:rgba(241,233,217,.05); font-size:13px; font-weight:500; }
.dialog-actions .primary { background:#e4dac4; border-color:#e4dac4; color:#2b2421; }
.detail-dialog { width:min(930px,calc(100% - 48px)); height:min(680px,calc(100dvh - 56px)); max-height:calc(100dvh - 56px); overflow:hidden; }
.detail-dialog[open] { display:flex; flex-direction:column; }
#detail-content { flex:1; min-height:0; overflow:hidden; }
.detail-pager { display:flex; align-items:center; justify-content:flex-end; gap:16px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line); flex-shrink:0; }
.detail-pager button { width:38px; height:36px; padding:0; border:1px solid var(--line); background:rgba(241,233,217,.05); color:var(--cream); }
.detail-pager>span { min-width:34px; text-align:center; font-size:12px; color:#c8beb0; font-variant-numeric:tabular-nums; }
.detail-equipment { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:minmax(0,1fr); height:100%; gap:16px; }
.equipment-card { display:flex; flex-direction:column; gap:12px; min-height:0; overflow:hidden; padding:20px; border:1px solid rgba(241,233,217,.11); border-radius:18px; background:rgba(241,233,217,.025); }
.equipment-card img { width:100%; height:150px; min-height:0; object-fit:contain; flex-shrink:1; }
.equipment-card>span { color:#aaa699; font-size:11px; }
.equipment-card h3 { color:var(--cream); font-size:17px; line-height:1.4; font-weight:500; letter-spacing:-.3px; }
.equipment-card p { color:#bcb4a8; font-size:12px; line-height:1.6; }
.detail-schedule-row { display:grid; grid-template-columns:100px 80px minmax(0,1fr); gap:18px; align-items:center; padding:18px 10px; min-height:60px; border-bottom:1px solid rgba(241,233,217,.1); font-size:14px; line-height:1.5; }
.detail-schedule-row>span:last-child { color:#bcb5aa; font-size:13px; }
.detail-schedule-row time { color:var(--cream); font-variant-numeric:tabular-nums; }
.detail-notice { margin-bottom:14px; color:#b7afa2; font-size:12px; line-height:1.6; }

@media(hover:hover) {
  .board-nav button:hover,.header-twitch:hover,.editor-toolbar button:hover:not(:disabled),.control-button:hover { background:rgba(241,233,217,.11); border-color:rgba(241,233,217,.28); color:#f4ece1; }
  .board-brand:hover { color:#e6d2a6; }
  .editor-toolbar #export-board:hover { background:#eee3cc; color:#2b2421; border-color:#eee3cc; }
  body:not([data-layout-editor=true]) .board-widget:hover { transform:translateY(-2px); border-color:rgba(241,233,217,.25); box-shadow:inset 0 1px 0 rgba(241,233,217,.05),0 16px 38px rgba(9,8,10,.26); }
  .channel-link[href]:hover { transform:translateY(-2px); }
  .channel-link[href]:hover .channel-avatar { background:rgba(165,188,214,.12); border-color:rgba(165,188,214,.35); }
  .channel-link[href]:hover b { color:var(--cream); }
  .widget-link:hover { color:#efe1c9; transform:translateY(-2px); }
  .widget-edit-controls button:hover { background:#40383b; border-color:rgba(241,233,217,.28); color:var(--cream); }
  .widget-edit-controls .widget-remove-button:hover { color:#e5ada9; border-color:#aa5c5a; background:#432d31; }
  .circle-button:hover,.mobile-pager button:hover:not(:disabled),.detail-pager button:hover:not(:disabled),.dialog-actions button:hover { background:rgba(241,233,217,.12); border-color:rgba(241,233,217,.3); }
  .dialog-actions .primary:hover { background:#eee3cc; color:#2b2421; }
}

@media(min-width:1280px) {
  .widget-heading h2 { font-size:14px; }
  .widget-content { padding:20px 22px; gap:12px; }
  .widget-note { font-size:13px; }
  .film-copy .widget-note { font-size:12px; }
}

@container(max-height:180px) {
  .widget-content { padding:14px 16px; gap:8px; }
  .widget-heading h2 { font-size:12px; }
  .widget-main { font-size:clamp(21px,7.8cqw,27px); }
  .widget-note,.widget-games { font-size:11px; }
  .widget-link { min-height:26px; padding-top:6px; }
  .widget-link-label { font-size:11px; }
  .setup-mini img { width:66px; height:46px; }
  .setup-mini p { font-size:12px; }
  .setup-mini small { font-size:10px; }
  .channels-row { gap:10px; }
  .channel-avatar { width:30px; height:30px; }
  .channel-link b { font-size:12px; }
  .channel-link small { font-size:10px; }
  .channel-link+.channel-link { padding-left:12px; }
  body[data-layout-editor=true] .widget-content { padding-top:14px; }
  body[data-layout-editor=true] .widget-edit-controls { top:13px; right:12px; }
  body[data-layout-editor=true] .next-copy .widget-note { display:none; }
}
@container(max-width:400px) {
  .widget-film-layout { gap:13px; }
  .widget-type-socials .channel-link { flex-direction:column; align-items:flex-start; gap:6px; }
  .channel-link small { font-size:10px; }
}
@container(max-width:240px) {
  body[data-layout-editor=true] .widget-content { padding:42px 10px 10px; gap:6px; }
  body[data-layout-editor=true] .widget-heading { min-height:0; padding-right:0; }
  body[data-layout-editor=true] .widget-heading h2 { font-size:11px; }
  body[data-layout-editor=true] .widget-main { font-size:18px; }
  body[data-layout-editor=true] .widget-note,body[data-layout-editor=true] .widget-link,body[data-layout-editor=true] .film-genre { display:none; }
  body[data-layout-editor=true] .widget-date { gap:5px; flex-direction:column; }
  body[data-layout-editor=true] .widget-date strong { font-size:20px; }
  body[data-layout-editor=true] .widget-date>span { font-size:11px; }
  body[data-layout-editor=true] .widget-film-layout { grid-template-columns:1fr; }
  body[data-layout-editor=true] .widget-poster { display:none; }
  body[data-layout-editor=true] .film-copy h3 { font-size:19px; }
  body[data-layout-editor=true] .setup-mini { flex-direction:column; align-items:flex-start; gap:4px; }
  body[data-layout-editor=true] .setup-mini img { width:48px; height:30px; }
  body[data-layout-editor=true] .setup-mini p { font-size:10px; }
  body[data-layout-editor=true] .setup-mini small { display:none; }
  body[data-layout-editor=true] .channels-row { gap:7px; }
  body[data-layout-editor=true] .channel-link { padding-left:0; border-left:0; gap:4px; }
  body[data-layout-editor=true] .channel-avatar { display:none; }
  body[data-layout-editor=true] .channel-link b { font-size:10px; }
  body[data-layout-editor=true] .channel-link small { display:none; }
}
@media(max-width:1200px) {
  body[data-layout-editor=true] .board-nav { display:none; }
  body[data-layout-editor=true] .board-brand { margin-right:auto; }
}
@media(max-width:1050px) {
  .board-shell { width:calc(100% - 32px); }
  .board-header { gap:16px; padding:0 22px; }
  .board-brand { font-size:29px; }
  .board-nav { gap:3px; }
  .board-nav button { padding:8px 10px; font-size:11px; }
  .header-twitch { padding:9px 12px; font-size:11px; }
  .widget-content { padding:16px; gap:9px; }
}
@media(max-width:767px) {
  .board-shell { width:calc(100% - 20px); height:calc(100dvh - 20px); margin:10px auto; grid-template-rows:18px minmax(0,1fr) 32px; gap:8px; }
  .outside-header>span:first-child { font-size:8px; letter-spacing:1.3px; }
  .outside-header>span:last-child { font-size:9px; }
  .outside-footer { font-size:9px; gap:10px; }
  .board-frame { border-radius:24px; grid-template-rows:68px minmax(0,1fr); }
  .board-frame::after { background-position:42.8% center; }
  .board-header { padding:0 16px; gap:12px; }
  .board-brand { font-size:28px; }
  .board-nav { gap:3px; margin-left:auto; margin-right:0; }
  .board-nav button { padding:8px 7px; gap:5px; min-height:40px; font-size:10px; }
  .board-nav .ui-icon { width:14px; height:14px; }
  .board-caption { display:none; }
  .widget-content { padding:16px 18px; gap:10px; }
  .widget-heading h2 { font-size:13px; }
  .widget-main { font-size:26px; }
  .widget-note,.widget-games { font-size:12px; }
  .widget-link { min-height:30px; }
  .widget-link-label { font-size:12px; }
  .widget-film-layout { grid-template-columns:88px minmax(0,1fr); gap:16px; }
  .film-copy h3 { font-size:26px; }
  .film-copy .widget-note { font-size:12px; }
  .widget-poster { max-height:190px; }
  .channel-link b { font-size:13px; }
  .channel-link small { font-size:11px; }
  .channel-avatar { width:32px; height:32px; }
  .channel-link+.channel-link { padding-left:12px; }
  .editor-toolbar { gap:6px; }
  .editor-toolbar button { min-height:40px; padding:9px 11px; font-size:11px; }
  .editor-toolbar #add-widget { width:38px; padding:9px; }
  .editor-toolbar #undo-widget { width:34px; padding:8px; }
  .editor-status { max-width:100%; font-size:9px; }
  .detail-dialog { width:calc(100% - 24px); height:calc(100dvh - 36px); max-height:calc(100dvh - 36px); padding:22px; }
  dialog h2 { font-size:24px; }
  .detail-equipment { grid-template-columns:1fr; }
  .equipment-card img { height:min(24vh,170px); }
  .equipment-card h3 { font-size:20px; }
  .equipment-card p { font-size:13px; }
  .detail-schedule-row { grid-template-columns:65px 55px minmax(0,1fr); padding:14px 0; gap:10px; font-size:12px; }
  .detail-schedule-row>span:last-child { font-size:12px; }
  .detail-pager { margin-top:16px; padding-top:14px; }
}
@media(max-width:360px) {
  .board-header { padding:0 12px; gap:8px; }
  .board-brand { font-size:24px; }
  .board-nav button { padding:7px 5px; font-size:9px; }
  .board-nav .ui-icon { display:none; }
  .outside-header>span:first-child { font-size:7px; }
}
@media(max-height:650px) {
  .board-shell { grid-template-rows:18px minmax(0,1fr) 22px; gap:8px; margin:10px auto; height:calc(100dvh - 20px); }
  .board-frame { grid-template-rows:58px minmax(0,1fr); }
  .board-caption h1 { font-size:30px; }
  .board-caption>span { font-size:7px; }
  .board-brand { font-size:27px; }
  .board-header { padding:0 20px; }
  .widget-content { padding:11px 14px; gap:7px; }
  .widget-heading h2 { font-size:11px; }
  .widget-main { font-size:23px; }
  .widget-note { font-size:10px; }
  .widget-link-label { font-size:10px; }
  .film-copy h3 { font-size:24px; }
  .film-copy { gap:8px; }
  .film-copy .widget-note { font-size:11px; }
  .channel-avatar { width:26px; height:26px; }
  .channel-avatar .ui-icon { width:14px; height:14px; }
  .channel-link b { font-size:11px; }
  .channel-link small { font-size:9px; }
  .setup-mini img { width:52px; height:36px; }
  .setup-mini p { font-size:11px; }
  .setup-mini small { font-size:10px; }
}
 @container(max-height:140px) {
   .widget-content { padding:8px 12px; gap:5px; }
   .widget-heading h2 { font-size:11px; }
   .widget-main { font-size:22px; }
   .next-copy { gap:4px; }
   .next-copy>.widget-note { display:none; }
   .widget-date strong { font-size:24px; }
   .widget-date>span { font-size:12px; }
   .widget-games { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; overflow:hidden; font-size:11px; line-height:1.4; }
   .widget-link { min-height:22px; padding-top:5px; }
   .widget-link-label { font-size:10px; }
   .setup-mini img { width:44px; height:32px; }
   .setup-mini p { font-size:11px; }
   .setup-mini small { font-size:10px; }
   .film-genre { display:none; }
   .channel-avatar { width:26px; height:26px; }
 }
/* Frosted glass treatment is limited to the two featured home widgets. */
.board-widget:is(.widget-type-next-stream,.widget-type-film) {
  background:
    radial-gradient(ellipse at 0 0,rgba(255,245,227,.15),transparent 65%),
    linear-gradient(145deg,rgba(255,245,229,.08),rgba(30,24,28,.25) 55%,rgba(20,19,24,.38));
  border-color:rgba(250,238,218,.3);
  border-top-color:rgba(255,246,231,.58);
  border-left-color:rgba(255,246,231,.4);
  box-shadow:inset 0 1px 0 rgba(255,250,239,.16),inset 0 -1px 0 rgba(255,240,222,.07),0 14px 36px rgba(12,9,15,.18);
  backdrop-filter:blur(26px) saturate(115%);
  -webkit-backdrop-filter:blur(26px) saturate(115%);
}
.board-widget:is(.widget-type-next-stream,.widget-type-film)::before {
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(120deg,rgba(255,249,236,.055),transparent 38%,transparent 75%,rgba(255,249,236,.025));
  pointer-events:none;
}
.board-widget:is(.widget-type-next-stream,.widget-type-film) .widget-heading h2 {
  color:#f4ebdd;
}
.board-widget:is(.widget-type-next-stream,.widget-type-film) .widget-heading>.widget-icon {
  color:#eee3d1;
  filter:drop-shadow(0 1px 5px rgba(255,235,206,.12));
}
.board-widget.widget-type-next-stream .next-copy {
  position:relative;
  padding-left:14px;
}
.board-widget.widget-type-next-stream .next-copy::before {
  content:'';
  position:absolute;
  left:0;
  top:18%;
  bottom:18%;
  width:2px;
  border-radius:2px;
  background:linear-gradient(180deg,rgba(255,239,213,.8),rgba(255,239,213,.1));
  box-shadow:0 0 12px rgba(255,235,203,.15);
}
.board-widget.widget-type-next-stream .widget-main,
.board-widget.widget-type-next-stream .widget-date strong {
  color:#fff3e1;
  text-shadow:0 2px 16px rgba(12,9,15,.22);
}
.board-widget.widget-type-next-stream .widget-date { flex-wrap:wrap; column-gap:12px; row-gap:4px; }
.board-widget.widget-type-next-stream .widget-date>span {
  color:#f2e9db;
}
.board-widget:is(.widget-type-next-stream,.widget-type-film) .widget-note,
.board-widget.widget-type-next-stream .widget-games { color:#e1d8ca; }
.board-widget.widget-type-next-stream .widget-link {
  border-top-color:rgba(255,243,222,.2);
  color:#eee3d2;
}
.board-widget.widget-type-next-stream .widget-link-icon {
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:50%;
  border:1px solid rgba(255,243,222,.2);
  background:rgba(255,243,222,.07);
}
.board-widget.widget-type-film .widget-poster {
  background:
    radial-gradient(ellipse at 15% 5%,rgba(237,221,199,.17),transparent 65%),
    linear-gradient(155deg,rgba(184,161,151,.1),rgba(29,24,29,.22));
  border-color:rgba(255,242,221,.24);
  box-shadow:inset 0 1px 0 rgba(255,248,233,.16),0 8px 20px rgba(12,9,15,.14);
}
.board-widget.widget-type-film .film-placeholder {
  width:48px;
  height:48px;
  background:linear-gradient(140deg,rgba(255,246,229,.16),rgba(255,246,229,.03));
  border-color:rgba(255,243,222,.35);
  color:#f9edda;
  box-shadow:inset 0 1px 0 rgba(255,250,239,.2),0 4px 16px rgba(12,9,15,.12);
}
.board-widget.widget-type-film .film-placeholder .ui-icon { width:24px; height:24px; }
.board-widget.widget-type-film .film-genre {
  align-self:flex-start;
  max-width:100%;
  padding:5px 8px;
  border:1px solid rgba(255,243,222,.18);
  border-radius:8px;
  background:rgba(255,243,222,.055);
  color:#e9dfcd;
  letter-spacing:.07em;
  overflow-wrap:anywhere;
}
.board-widget.widget-type-film .film-copy h3 {
  color:#fff3e1;
  text-shadow:0 2px 16px rgba(12,9,15,.22);
}
@container(max-height:190px) {
  .board-widget.widget-type-film .film-genre { padding:3px 6px; }
  .board-widget.widget-type-next-stream .next-copy { padding-left:10px; }
}
@media(hover:hover) {
  body:not([data-layout-editor=true]) .board-widget:is(.widget-type-next-stream,.widget-type-film):hover {
    border-color:rgba(255,243,222,.48);
    box-shadow:inset 0 1px 0 rgba(255,250,239,.22),inset 0 -1px 0 rgba(255,240,222,.08),0 18px 40px rgba(12,9,15,.23);
  }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .board-widget:is(.widget-type-next-stream,.widget-type-film) {
    background:linear-gradient(145deg,#514741,#262329);
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition:none!important; animation:none!important; }
  button,a,.board-widget:hover { translate:none!important; transform:none!important; }
}