.kiosk-section { color:#fff; background:linear-gradient(135deg,#202019,#111); border:1px solid #494534; border-radius:22px; padding:26px; margin:24px 0; font-family:'DM Sans',sans-serif; text-align:left; }
.kiosk-heading { display:flex; align-items:center; gap:16px; margin-bottom:16px; }
.kiosk-heading img { width:54px; height:54px; flex:none; }
.kiosk-heading h2 { flex:1; min-width:0; }
.kiosk-section .kiosk-radio-toggle,.kiosk-dialog .kiosk-radio-toggle { display:inline-flex; align-items:center; justify-content:center; flex:none; margin-left:auto; width:47.5px; height:47.5px; padding:0; border:2px solid #fff; border-radius:50%; background:transparent; color:#fff; cursor:pointer; }
.kiosk-section .kiosk-radio-toggle:hover,.kiosk-dialog .kiosk-radio-toggle:hover { border-color:#fff; background:rgba(255,255,255,.14); }
.kiosk-radio-toggle:focus-visible { outline:3px solid #ffc108; outline-offset:4px; }
.kiosk-radio-icon { display:block; width:16.25px; height:18.75px; margin-left:3.75px; background:#fff; clip-path:polygon(0 0,100% 50%,0 100%); }
.kiosk-radio-toggle[data-playing=true] .kiosk-radio-icon { width:15px; height:15px; margin-left:0; clip-path:none; border-radius:1px; }
.kiosk-radio-title,.kiosk-radio-artist { display:block; overflow-wrap:anywhere; }
.kiosk-radio-artist { margin-top:5px; color:#e2dccc; font-size:.88em; }
.kiosk-radio-banner { display:block; box-sizing:border-box; width:100%; height:auto; aspect-ratio:3/1; object-fit:cover; border-radius:12px; margin:18px auto 0; }
.kiosk-radio-banner[hidden] { display:none; }
.kiosk-radio-visualizer { display:block; width:100%; height:40px; margin:18px 0 0; opacity:.7; pointer-events:none; }
@media(max-width:440px){.kiosk-radio-visualizer{height:32px;}}
.kiosk-section h2,.kiosk-dialog h2 { margin:0; font-size:36px; color:#FFC108; }
.kiosk-section p,.kiosk-dialog p { font-size:23px; line-height:1.5; margin:8px 0 20px; }
.kiosk-channels { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.kiosk-button,.kiosk-dialog button { font:inherit; font-size:23px; line-height:1.3; padding:14px 18px; color:#fff; background:#272722; border:1px solid #66604b; border-radius:12px; cursor:pointer; }
.kiosk-button:hover,.kiosk-dialog button:hover { border-color:#FFC108; }
.kiosk-button[aria-pressed=true],.kiosk-primary { background:#FFC108!important; color:#191912!important; font-weight:700; }
.kiosk-button:disabled,.kiosk-dialog button:disabled { opacity:.5; cursor:wait; }
.kiosk-playing { margin-top:20px; font-size:23px; color:#e2dccc; min-height:34px; text-align:center; }
.kiosk-launch-artist { position:absolute; right:18px; top:14px; z-index:3; background:#FFC108; color:#191912; font-weight:700; padding:10px 16px; border:0; border-radius:10px; font-size:27px; cursor:pointer; }
#myprofil { position:relative; }
#kiosk-map-button { position:absolute; top:calc(env(safe-area-inset-top,0px) + var(--yosh-fixed-header-height) + 9px); right:18px; left:auto; z-index:9060; width:144px; height:144px; padding:18px; border:1px solid #FFC108; background:#191912; border-radius:28px; cursor:pointer; }
.map-public-controls .map-state-control,.map-public-controls .map-action-control { margin-left:0; }
#kiosk-map-button img { width:100%; height:100%; }
.kiosk-dialog { box-sizing:border-box; width:min(94vw,680px); max-width:680px; max-height:90vh; max-height:90dvh; padding:24px; border:1px solid #6c6345; border-radius:18px; background:#151512; color:#fff; font-family:'DM Sans',sans-serif; font-size:22px; text-align:left; overflow:auto; }
.kiosk-dialog::backdrop { background:rgba(0,0,0,.78); }
.kiosk-dialog .kiosk-close { float:right; font-size:22px; padding:8px 12px; margin-left:14px; }
.kiosk-dialog h3 { font-size:25px; margin:24px 0 12px; }
.kiosk-dialog label { display:block; margin:14px 0; }
.kiosk-dialog input:not([type=checkbox]),.kiosk-dialog textarea,.kiosk-dialog select { box-sizing:border-box; width:100%; font:inherit; font-size:21px; color:#fff; border:1px solid #5b5849; border-radius:8px; background:#25251e; padding:11px; margin-top:7px; }
.kiosk-dialog textarea { min-height:95px; resize:vertical; }
.kiosk-dialog input[type=checkbox] { width:22px; height:22px; accent-color:#FFC108; vertical-align:middle; }
.kiosk-message { font-size:20px; line-height:1.4; color:#e5d28c; margin:12px 0; }
.kiosk-message[data-error=true] { color:#ff9c92; }
.kiosk-tabs { display:flex; flex-wrap:wrap; gap:10px; margin:20px 0; }
.kiosk-tabs button[aria-selected=true] { border-color:#FFC108; color:#FFC108; }
.kiosk-track { padding:18px 0; border-bottom:1px solid #444; overflow-wrap:anywhere; }
.kiosk-track strong { display:block; }
.kiosk-track-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.kiosk-track-heading strong { flex:1; }
.kiosk-dialog .kiosk-track-remove { flex:none; width:30px; height:30px; padding:0; font-size:22px; line-height:1; border-radius:50%; }
.kiosk-profile-summary { margin:20px 0; }
#kiosk-profile-editor[hidden] { display:none; }
.kiosk-track small { display:block; margin:8px 0; color:#bbb; font-size:18px; }
.kiosk-track audio { display:block; width:100%; margin:10px 0; }
.kiosk-artist { display:flex; width:100%; text-align:left; gap:15px; align-items:center; margin:12px 0; }
.kiosk-artist img,.kiosk-profile-photo { width:76px; height:76px; object-fit:cover; border-radius:50%; }
.kiosk-artist span { display:block; }
.kiosk-artist small { display:block; margin-top:8px; color:#bbb; font-size:18px; }
.kiosk-banner { width:100%; max-height:220px; object-fit:cover; border-radius:12px; margin-bottom:18px; }
.kiosk-bio { white-space:pre-wrap; }
.kiosk-dialog a { color:#FFC108; text-decoration:underline; overflow-wrap:anywhere; }
.kiosk-contacts { display:flex; flex-wrap:wrap; gap:20px; padding:16px 0; }
.kiosk-admin { max-width:800px; margin:40px auto; padding:20px; font:18px 'DM Sans',sans-serif; color:white; background:#151512; }
.kiosk-upload-confirmation { padding:14px; border-left:4px solid #ffc108; background:#292817; color:#fff; }
.kiosk-admin input,.kiosk-admin select,.kiosk-admin button { font:inherit; padding:10px; margin:8px 0; }
@media(min-width:640px){html.yosh-desktop-compact .kiosk-section { padding:34px; } html.yosh-desktop-compact .kiosk-section h2 {font-size:48px;} html.yosh-desktop-compact .kiosk-section p,html.yosh-desktop-compact .kiosk-button,html.yosh-desktop-compact .kiosk-playing {font-size:32px;} }
@media(max-width:440px){.kiosk-dialog .kiosk-section{padding:18px;}.kiosk-heading{gap:8px;}.kiosk-heading img{width:36px;height:36px;}.kiosk-dialog .kiosk-heading h2{font-size:22px;}.kiosk-section .kiosk-radio-toggle,.kiosk-dialog .kiosk-radio-toggle{width:42.5px;height:42.5px;}.kiosk-dialog {font-size:16px;padding:18px;} .kiosk-dialog h2{font-size:25px;} .kiosk-dialog p,.kiosk-dialog button,.kiosk-dialog input:not([type=checkbox]),.kiosk-dialog textarea,.kiosk-dialog select{font-size:16px;} .kiosk-dialog h3{font-size:20px;} .kiosk-message{font-size:15px;} }

/* Spectrum is flush with its own kiosk card, with no inactive stripe. */
.kiosk-section { overflow:hidden; }
.kiosk-section > .kiosk-radio-visualizer { margin:18px -26px -26px; width:calc(100% + 52px); background:transparent; border:0; box-shadow:none; }
body.kiosk-radio-open #oscilloscope { display:none!important; }
@media(min-width:640px){html.yosh-desktop-compact .kiosk-section > .kiosk-radio-visualizer{margin:18px -34px -34px;width:calc(100% + 68px);}}
@media(max-width:440px){.kiosk-dialog .kiosk-section > .kiosk-radio-visualizer{margin:18px -18px -18px;width:calc(100% + 36px);}}

.kiosk-rights-note { padding:10px; border-left:3px solid var(--y-yellow,#f6c328); font-size:12px; line-height:1.5; }
.kiosk-admin textarea { display:block; width:100%; min-height:90px; margin:8px 0 14px; padding:10px; background:var(--y-card,#23231e); color:var(--y-fg,#f3f1ea); border:1px solid var(--y-line,#555); border-radius:6px; font:400 14px/1.5 var(--y-body,sans-serif); }

.kiosk-admin .kiosk-track { padding:20px 0; }
.kiosk-admin .kiosk-track > label { display:block; margin:18px 0 8px; color:var(--y-muted,#bbb); font-size:12px; }
.kiosk-admin .kiosk-track > button { display:block; width:100%; margin:10px 0; }
.kiosk-admin .kiosk-track > h2 { font:400 22px/1.15 var(--y-display,sans-serif); }
.kiosk-admin button:disabled { opacity:.4; cursor:default; }