/* Monochrome listening room: record sleeves, ink outlines, paper notes. */
:root{--room-bg:#fafafa;--room-panel:#fff;--room-line:#222;--room-text:#191919;--room-muted:#666;--room-paper:#fff}
body{background:#ececec;color:#191919}
.sidebar{padding:26px 0 22px;align-items:center}
.brand{position:relative;background:#181818;color:#fff;padding:14px 24px 12px;border-radius:42% 38% 44% 32% / 24% 40% 26% 35%;transform:rotate(-2deg);font-family:Pretendard,Arial,sans-serif;font-weight:900;font-style:italic;letter-spacing:-1px;font-size:29px;border:3px solid #181818;box-shadow:inset 0 0 0 2px #fff}
.brand span{font-style:normal;letter-spacing:2px;font-size:7px;color:#fff}
nav a,nav a:nth-child(2),nav a:nth-child(3){color:#666;border-color:transparent}nav a.active{color:#171717;border-bottom:3px solid #171717}nav a:hover{color:#111}
main{background:#fafafa;border:2px solid #222;border-radius:7px 12px 5px 9px;box-shadow:6px 7px 0 #222;margin-top:0;padding:24px 36px 30px}
header{color:#666}.demo{color:#777}
.week-tabs{gap:22px;border:0;margin:4px 0 36px;padding:8px 8px 10px;overflow:visible}
.week-tabs button{position:relative;isolation:isolate;min-height:110px;padding:18px 30px 16px 16px;border:0;background:none;color:#333;transform:rotate(-2deg);font-size:14px;text-align:left}
.week-tabs button:nth-child(even){transform:rotate(2deg)}
.week-tabs button:before{content:'';position:absolute;z-index:-2;right:-5px;top:9px;width:88px;height:88px;border:2px solid #171717;border-radius:50%;background:radial-gradient(circle,#fff 0 4px,#222 5px 13px,#fafafa 14px 16px,transparent 17px),repeating-radial-gradient(#191919 0 3px,#484848 4px,#191919 5px);transition:transform .15s}
.week-tabs button:after{content:'';position:absolute;z-index:-1;inset:0 20px 0 0;background:#fff;border:2px solid #222;border-radius:3px 6px 2px 4px;box-shadow:3px 4px 0 #222}
.week-tabs button.active{background:none;color:#fff;border:0}.week-tabs button.active:after{background:#222;box-shadow:3px 4px 0 #aaa}
.week-tabs button:hover:before{transform:translateX(4px)}.week-tabs small{font-size:10px;letter-spacing:1.2px;margin-bottom:10px}
.session{gap:38px;border-bottom:2px solid #222;padding-bottom:32px}.session h2{color:#171717;font-weight:750}.session .eyebrow{color:#666}
.ost-list{border-color:#222}.ost-list button{color:#222;border-color:#ddd}.ost-list button>span{color:#666}.ost-list button:hover,.ost-list button[aria-pressed=true]{background:#e8e8e8}.ost-list button:focus-visible{outline-color:#222}
.ost-list .hint{color:#777}
.session aside{position:relative;background:white;border:2px solid #222;border-radius:23px 18px 26px 16px / 17px 26px 18px 22px;box-shadow:4px 5px 0 #ddd;padding:22px;margin-bottom:18px;color:#222}
.session aside:before{content:'';position:absolute;width:22px;height:22px;background:#fff;border-right:2px solid #222;border-bottom:2px solid #222;bottom:-13px;left:30px;transform:skewY(32deg) rotate(25deg)}
.session aside p{color:#222;font-weight:500}.session aside .eyebrow{color:#666}.session aside .save-icon{color:#fff;background:#222;border:0;transform:rotate(-5deg)}
.section-head:before{content:'LISTEN. FEEL. LEAVE A NOTE.';font-weight:700;letter-spacing:1.5px;color:#666}.section-head h2{color:#222;font-weight:700}.section-head span{color:#777}
.grid,.section-head + .grid{padding:12px 4px 18px;gap:28px;background-image:radial-gradient(#bbb .65px,transparent .65px);background-size:18px 18px}
.doodle-card,.doodle-card:nth-child(even){border:2px solid #222;border-radius:4px 9px 3px 7px;background:#fff;box-shadow:4px 5px 0 #222;margin:0;transform:none;padding:20px 22px}
.card-top{border-bottom:1px dashed #bbb}.object-story .record-doodle{stroke-width:2.8;width:104px;height:104px}.person-name{font-size:12px;color:#666}.object-story h3{font-weight:750}.object-decoration,.doodle-card:nth-child(even) .object-decoration{opacity:.3}
.card-bottom.social-actions{border-top:1px dashed #bbb}.social-actions .save-icon:hover{background:#eee;border-radius:50%}
.intro h1{color:#222;font-weight:750}.intro p{color:#666}
.toolbar.icon-tabs{border-color:#222}.toolbar.icon-tabs .save-icon{color:#777}.toolbar.icon-tabs .save-icon[aria-pressed=true]{color:#222;border-color:#222;background:#22208}.toolbar.icon-tabs .save-icon:hover{color:#222;background:#eee}
.admin-preview{color:#666;border-color:#ccc}.admin-preview [data-program]{border-color:#777;border-radius:4px}footer{color:#777}.empty{color:#666;border-color:#bbb}
dialog{border:2px solid #222;border-radius:12px 8px 14px 6px;background:#fafafa;box-shadow:5px 7px 0 #222}dialog::backdrop{background:#0009}.reply{border:1px solid #ddd;background:white;border-radius:12px 9px 11px 4px}
.doodle-picker{background:white;border:1px dashed #aaa}.doodle-choice{border-radius:5px 8px 4px 7px}.doodle-choice[aria-pressed=true]{background:#eee;border-color:#222}
#toast{border:2px solid #222;background:#fff;color:#222;box-shadow:3px 4px 0 #222}
@media(max-width:680px){
 body{background:#fafafa}.sidebar{padding:18px 20px 0}.brand{display:inline-flex;flex-direction:column;align-items:flex-start;gap:3px;padding:10px 20px 9px;font-size:25px}.brand span{font-size:6px;letter-spacing:1.6px}.sidebar nav{margin-top:16px}
 main{border:0;box-shadow:none;border-radius:0;padding:16px 20px 28px}
 .week-tabs{gap:9px;padding:6px 0 10px;margin-bottom:26px}.week-tabs button{min-height:102px;padding:12px 15px 12px 8px;font-size:11px;line-height:1.55}.week-tabs small{font-size:8px;letter-spacing:.4px;margin-bottom:9px}
 .week-tabs button:after{right:9px}.week-tabs button:before{width:61px;height:61px;right:-3px;top:19px}.session{padding-bottom:26px}.session aside{margin-top:22px;padding:18px 20px}
 .grid,.section-head + .grid{gap:24px;padding:8px 4px 16px}.doodle-card,.doodle-card:nth-child(even){padding:18px 18px}.section-head h2{font-size:20px}
}
@media(prefers-reduced-motion:reduce){.week-tabs button:before{transition:none}}
.film-doodle{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:28px;padding:24px 28px;margin-bottom:32px;border:2px solid #222;border-radius:8px 18px 10px 14px;background:#fff}
.film-doodle h2{font-size:clamp(22px,3vw,34px);line-height:1.5;word-break:keep-all;color:#191919}
.film-doodle img{display:block;width:100%;max-width:320px;height:auto;justify-self:center}
.chat-entry{flex-shrink:0}.chat-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:18px 0}.chat-tabs button{padding:12px;border:1px solid #222;background:white;color:#222;border-radius:7px;font:inherit;cursor:pointer}.chat-tabs button[aria-pressed=true]{background:#222;color:white}.chat-messages{height:clamp(220px,40vh,420px);overflow:auto;padding:12px;border:1px solid #ddd;border-radius:9px;background:#f5f5f5;overscroll-behavior:contain}.chat-message{max-width:85%;margin:10px 0 16px auto;text-align:right}.chat-message p{background:#222;color:white;padding:12px 16px;border-radius:14px 14px 3px 14px;text-align:left;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6;margin:5px 0}.chat-message time,.chat-message small{font-size:11px;color:#666}#chat-form{display:flex;align-items:flex-end;gap:8px;margin-top:14px}#chat-form textarea{flex:1;min-width:0;min-height:64px;margin:0}#chat-form button{flex:0 0 44px}
.candidate-guide{border:1px solid #bbb;border-radius:8px;padding:16px;margin:20px 0}.candidate-guide summary{cursor:pointer;font-weight:600}.candidate-guide li{line-height:1.8;margin:12px 0;word-break:keep-all}.answer-preview strong{display:block;margin:12px 0;font-size:14px;line-height:1.7}.question-answers{max-height:420px;overflow:auto}#question-form[hidden]{display:none}#question-candidate{max-width:100%;font-size:14px}
.question-paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0 0 42px}
.question-box{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:20px;padding:24px 22px;border:2px solid #222;border-radius:9px 16px 7px 12px;background:#fff;color:#222;box-shadow:3px 4px 0 #222;font:inherit;cursor:pointer;min-width:0}
.question-box strong{font-size:19px;line-height:1.65;word-break:keep-all}.question-box>span:last-child{margin-top:auto;font-size:12px}.question-box:hover{background:#f2f2f2}.question-box:focus-visible{outline:3px solid #222;outline-offset:5px}
.answer-question{display:block;font-size:12px;line-height:1.7;color:#555;padding:10px 0}.answer-question b{display:block;color:#222;font-size:14px}.answer-preview{display:block;width:100%;text-align:left;border:1px solid #bbb;background:#fff;border-radius:8px;padding:18px;margin:14px 0;font:inherit;color:#222;cursor:pointer}.answer-preview p{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8}.answer-preview span{font-size:12px}.question-answers{margin-bottom:24px}
@media(max-width:760px){.question-paths{grid-template-columns:1fr}.question-box{padding:22px;gap:14px}.question-box strong{font-size:18px}}
.song-material{padding:4px 0 16px}.song-material h3{margin:24px 0 10px;font-size:17px}.song-material .body-copy{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.9}.lyrics-video{display:inline-block;color:#222;text-underline-offset:4px;padding:10px 0}.compose-lyrics{border:1px solid #ccc;border-radius:8px;padding:14px 16px;margin:14px 0}.compose-lyrics summary{cursor:pointer;font-weight:600}.compose-lyrics .song-material{max-height:280px;overflow:auto}.ost-row>a{min-width:0}.ost-row>a strong{overflow-wrap:anywhere}
@media(max-width:680px){.film-doodle{grid-template-columns:1fr;gap:12px;padding:22px 16px}.film-doodle h2{font-size:23px;margin:8px 0}.film-doodle img{max-width:260px}}
.session{display:block}
.session{display:block}
.ost-row{display:flex;align-items:center;gap:18px;padding:15px 4px;border-bottom:1px solid #ddd}
.ost-number{font-size:12px;color:#666;font-variant-numeric:tabular-nums}
.ost-row>a{flex:1;color:#191919;text-decoration:none;min-width:0;padding:4px 0}
.ost-row>a:hover strong{text-decoration:underline;text-underline-offset:4px}
.ost-row small{display:block;color:#666;font-size:11px;margin-top:6px}
.ost-row .save-icon{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:10px;border:0}
.listening-question{display:block;padding:30px 32px;margin:0 0 40px;border:2px solid #222;border-radius:6px 16px 8px 12px;background:#fff;box-shadow:3px 4px 0 #222}
.listening-question p{font-size:clamp(20px,2.2vw,28px);font-weight:700;line-height:1.6;word-break:keep-all;max-width:740px;margin:14px 0}
@media(max-width:680px){.listening-question{padding:22px 20px}.ost-row{gap:12px}.ost-row strong{font-size:15px}}