/* People open stories; music objects are non-interactive decoration. */
.object-story h3{word-break:keep-all;overflow-wrap:break-word;text-wrap:balance}
:root{--ink:#4e5945;--olive:#89916c;--sand:#d8c4a4}
nav a:nth-child(2){background:#dcd0b8}nav a:nth-child(3){background:#d4d9c6}.primary{background:var(--ink)}.reply{background:#e8e9d8}.record-art{background:#ddd1b9}
#view:has(.hero){display:flex;flex-direction:column}.hero{width:100%;display:grid;grid-template-columns:1fr 240px;gap:35px;margin-bottom:10px}.hero h1{font-size:32px}.hero-photo{height:170px}.hero p{margin:8px 0}.week-tabs{width:100%;margin:10px 0 22px}.week-tabs button{font-size:12px;padding:12px}.session{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-bottom:25px;border-bottom:1px solid #d8d9c7}.session aside{margin:0}.section-head{width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:8px;border:0;margin:26px 0 5px;padding:0}.section-head:before{content:'OUR LISTENING NOTES';width:100%}.section-head h2{margin:3px 0;font-size:23px}.section-head span{font-size:10px}
.grid,.section-head + .grid{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 50px;margin:12px 0 0;padding:25px 22px 40px;border:0;background-image:radial-gradient(#8a8f642b .8px,transparent .8px);background-size:19px 19px}
.doodle-card{border:0;background:transparent;padding:18px 20px;transform:rotate(-2deg);align-self:start}.doodle-card:nth-child(even){transform:rotate(2deg);margin-top:40px}.doodle-card:before{content:'♪';color:#8c9577;right:8px;top:75px;font-size:39px;transform:rotate(14deg)}.doodle-card:nth-child(even):before{content:'✳';left:0;right:auto}.card-top{border-bottom:1px dashed #bfc5ae;padding-bottom:10px;color:#657057}.object-story{border:0;background:none;display:block;width:100%;text-align:center;padding:14px 0 0;border-radius:8px}.object-story:hover .music-object{transform:rotate(3deg) translateY(-4px)}.object-story h3{max-width:none;margin:12px 0 6px;font-size:20px}.object-story p{font-size:13px;line-height:1.9;max-width:310px;margin:0 auto 10px;color:#68705f}.object-caption{display:block;font-size:9px;letter-spacing:1.5px;color:#7d856c}.card-bottom{margin-top:14px;justify-content:space-around;border-top:1px dashed #c7ccb9;padding-top:7px}.text-btn{font-size:11px}.music-object{position:relative;display:block;margin:12px auto 22px;width:180px;height:160px;transition:transform .2s;filter:drop-shadow(3px 7px 2px #6c654a20)}.music-object em{position:absolute;font-style:normal;font-size:9px;line-height:1.4;letter-spacing:1px}
/* LP in an imperfect paper sleeve */
.object-1{width:165px;height:165px;background:#c8cdae;border:2px solid var(--ink);border-radius:4px 8px 3px 7px;transform:rotate(-8deg)}.object-1:before,.object-4:before{content:'';position:absolute;width:135px;height:135px;border-radius:50%;background:repeating-radial-gradient(#41493c 0 3px,#64705a 4px 5px);border:2px solid #41493c;top:12px;left:42px}.object-1 i,.object-4 i{position:absolute;z-index:1;width:48px;height:48px;background:#d9c4a0;border:2px solid #424e38;border-radius:50%;top:56px;left:86px}.object-1 i:after,.object-4 i:after{content:'';position:absolute;inset:19px;border-radius:50%;background:#46523d}.object-1 em{bottom:8px;left:10px;text-align:left}.object-1 b{position:absolute;width:35px;height:18px;top:-9px;left:16px;background:#d9c9a2aa;transform:rotate(8deg)}
/* Small keyboard */
.object-2{height:115px;margin-top:37px;margin-bottom:47px;width:205px;background:#8d9778;border:2px solid var(--ink);border-radius:10px 6px 7px 3px;transform:rotate(6deg)}.object-2:before{content:'';position:absolute;bottom:8px;left:9px;right:9px;height:59px;background:repeating-linear-gradient(90deg,#f7f2df 0 19px,#697356 20px 21px);border:2px solid #4e5945;border-radius:3px}.object-2 i{position:absolute;top:45px;left:23px;width:159px;height:31px;background:repeating-linear-gradient(90deg,#434e3b 0 11px,transparent 12px 22px);z-index:1}.object-2 em{top:8px;left:12px;font-size:8px;text-align:left}.object-2 b{position:absolute;right:12px;top:11px;width:35px;height:13px;background:#d8c4a4;border:1px solid #4e5945}
/* Cassette */
.object-3{width:195px;height:130px;margin-top:28px;margin-bottom:34px;background:#d8c4a4;border:2px solid var(--ink);border-radius:9px 6px 10px 5px;transform:rotate(-5deg)}.object-3:before{content:'';position:absolute;inset:18px 14px 35px;background:#f4efdc;border:2px solid var(--ink);border-radius:5px}.object-3 i,.object-3 b{position:absolute;top:36px;width:35px;height:35px;border:7px solid #677454;border-radius:50%;left:30px;background:#dadbc5}.object-3 b{left:auto;right:30px}.object-3 em{bottom:8px;left:57px;font-size:8px}.object-3:after{content:'';position:absolute;left:66px;right:66px;top:48px;height:10px;border-block:2px solid #677454}
/* Turntable */
.object-4{width:205px;height:160px;background:#b9c19e;border:2px solid var(--ink);border-radius:6px 10px 5px 8px;transform:rotate(5deg)}.object-4:before{left:9px;top:9px;width:123px;height:123px}.object-4 i{left:49px;top:49px;width:44px;height:44px}.object-4 i:after{inset:17px}.object-4 b{position:absolute;right:18px;top:15px;width:13px;height:96px;border:3px solid #556247;border-radius:9px;transform:rotate(24deg);background:#e2dcc2}.object-4 em{left:12px;bottom:5px;font-size:7px}
@media(prefers-reduced-motion:reduce){.music-object{transition:none}}
@media(max-width:680px){.hero{display:block}.hero-photo{display:none}.hero h1{font-size:27px}.hero p{font-size:13px}.session{display:block;padding-bottom:20px}.session>div>p,.session>div>.meta{display:none}.session aside{margin-top:15px}.session h2{font-size:18px}.section-head{display:block;margin-top:23px}.section-head h2{font-size:20px;margin:9px 0}.section-head span{display:block}.grid,.section-head + .grid{grid-template-columns:1fr;gap:5px;padding:8px 5px 25px}.doodle-card{padding:15px 10px;transform:rotate(-1deg)}.doodle-card:nth-child(even){margin-top:5px;transform:rotate(1deg)}.object-story h3{font-size:19px}.object-story p{font-size:14px}.music-object{margin-bottom:19px}.object-2{margin-bottom:44px}.object-3{margin-bottom:31px}.text-btn{font-size:12px}.card-top{font-size:11px}.intro h1{font-size:27px}}
