/* Small objects should feel like discoveries, not full-size application windows. */
#place {--room-ink:#f0e3cd;--room-muted:#bcb29f;--room-accent:#d5b784;--room-surface:#172a29;color:var(--room-ink);background:linear-gradient(145deg,color-mix(in srgb,var(--room-surface),white 5%),var(--room-surface));border:1px solid #cdb58255;border-radius:7px;box-shadow:0 18px 75px #0006;padding:27px 30px;}
body[data-site-room=hex] #place{--room-surface:#202e2b;--room-accent:#d5b592}
body[data-site-room=aelin] #place{--room-surface:#2c2638;--room-accent:#d6bcec;--room-muted:#c3b3cd}
body[data-site-room=bastion] #place{--room-surface:#281f24;--room-accent:#d8b476;--room-muted:#c5b1ac}
#place::backdrop{background:#07121455;backdrop-filter:blur(2px)}
#place #eyebrow{font:10px/1.6 Georgia,serif;letter-spacing:1.7px;text-transform:uppercase;color:var(--room-accent);margin:0 42px 10px 0}
#place #title{font:normal 27px/1.2 Georgia,serif;letter-spacing:-.5px;margin:0 38px 22px 0;text-wrap:balance}
#place #body>p{font-size:15px;line-height:1.65}
#place form{position:sticky;top:0;float:right;margin:-9px -12px 0 0;z-index:4;background:var(--room-surface);border-radius:50%}
#place form button{font:25px Georgia,serif;width:40px;height:40px;color:var(--room-muted)}
#place form button:hover{color:#fff;background:#ffffff0a;border-radius:50%}
#place .return{font:10px/1.5 Georgia,serif;letter-spacing:.5px;color:var(--room-muted);border-top:1px solid #cfb78f20;padding-top:14px;margin:22px 0 0}
#place[data-activity=note]{max-width:440px}
#place[data-activity=workshop]{width:min(640px,calc(100% - 28px));max-width:640px;padding:25px 28px;border-color:#d5b78480;box-shadow:0 18px 75px #0006,inset 0 0 0 5px #d5b78404}
#place[data-activity=workshop] #title{margin-bottom:10px}
#place .workshop-intro{color:var(--room-muted);margin:0 0 20px}
.workshop-directory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #cfb78f40;border-radius:4px;overflow:hidden}
#place .workshop-door{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 18px;align-content:start;gap:7px 12px;width:100%;height:auto;min-height:132px;padding:19px 20px;border:0;background:transparent;color:var(--room-ink);text-align:left;text-decoration:none;font-family:Georgia,serif;cursor:pointer;border-radius:0;transition:background .2s}
#place .workshop-door:nth-child(odd){border-right:1px solid #cfb78f30}
#place .workshop-door:nth-child(-n+2){border-bottom:1px solid #cfb78f30}
.workshop-door strong{grid-column:1;display:block;font-size:21px;font-weight:normal;line-height:1.2}
.workshop-door small{grid-column:1/-1;display:block;color:var(--room-muted);font-size:12px;line-height:1.55}
.workshop-arrow{grid-column:2;grid-row:2;align-self:center;justify-self:end;color:var(--room-accent);font-size:17px}
.workshop-number{grid-column:1/-1;font-size:9px;letter-spacing:1.5px;color:var(--room-accent)}
#place .workshop-door:hover{background:#d5b7840d}
#place .workshop-door:focus-visible{outline:2px solid var(--room-accent);outline-offset:-4px}
.workshop-community a:focus-visible{outline:2px solid var(--room-accent);outline-offset:4px}
.workshop-community{display:grid;grid-template-columns:1fr 1fr;gap:13px 24px;margin-top:20px}
#place .workshop-community p{grid-column:1/-1;font-size:12px;margin:0;color:var(--room-muted);font-style:italic}
.workshop-community a{display:block;min-height:44px;color:var(--room-ink);font-size:13px;line-height:1.5;text-decoration-color:#d5b78470;text-underline-offset:4px}
.workshop-community small{display:block;margin-top:4px;font-size:10px;line-height:1.6;color:var(--room-muted)}
#place[data-activity=workshop] .return{margin-top:15px;padding-top:12px}
@media(max-width:520px){#place[data-activity=workshop]{padding:22px 20px}#place .workshop-intro{font-size:13px;line-height:1.5;margin-bottom:15px}.workshop-directory{grid-template-columns:1fr}#place .workshop-door{min-height:0;padding:13px 15px;gap:5px 10px}#place .workshop-door:nth-child(odd){border-right:0}#place .workshop-door:not(:last-child){border-bottom:1px solid #cfb78f30}.workshop-door strong{font-size:19px}.workshop-door small{font-size:11px;line-height:1.45}.workshop-number{font-size:8px;letter-spacing:1.2px}.workshop-community{gap:10px 14px;margin-top:16px}}
@media(max-width:350px){#place[data-activity=workshop]{padding:20px 16px}.workshop-community a{font-size:12px}.workshop-community small{font-size:9px}}
#place .story-action{min-height:42px;font-size:14px!important;padding:9px 14px!important;border-color:#ccb48855!important;border-radius:4px;color:var(--room-ink);background:#ffffff03;transition:background .2s,border-color .2s}
#place .story-action:hover{background:#d7bc8717;border-color:var(--room-accent)!important}
#place .activity-result{background:transparent;border-left:1px solid var(--room-accent);padding:5px 0 5px 15px;font-size:14px;line-height:1.65;color:var(--room-muted)}
#place .activity-label{font-size:12px;color:var(--room-accent);margin:17px 0}
#place .activity-label select{margin-top:7px;border-radius:3px;border-color:#ccb48840;background:#ffffff05;color:var(--room-ink);padding:10px 12px;font-size:14px}
#place .activity-label option{background:var(--room-surface)}
#place .activity-choices{gap:8px;margin:17px 0}
#place[data-activity=tea]{max-width:510px}
.tea-setting{--brew-light:#cc8256;--brew-dark:#753c26;position:relative;isolation:isolate;margin:0 -30px;overflow:hidden;background:#293530;height:235px;border-block:1px solid #d5b78425}
.tea-window{position:absolute;inset:0;background:linear-gradient(#18252066,#172724cc),url(room-hex.png) 45% 40%/cover;filter:blur(3px);transform:scale(1.05);z-index:-1}
.tea-setting:after{content:'';position:absolute;inset:auto 0 0;height:60%;background:linear-gradient(transparent,#1723219c);z-index:-1}
.tea-illustration{display:block;height:225px;width:100%;filter:drop-shadow(0 8px 9px #090c0a33)}
.tea-scene-caption{position:absolute;bottom:10px;left:0;right:0;text-align:center;font:8px Georgia,serif;letter-spacing:3px;color:#ebd6b0}
.tea-steam path{opacity:.45;animation:tea-breathe 5s ease-in-out infinite;transform-origin:center}
.tea-steam path:nth-child(2){animation-delay:-1.7s}.tea-steam path:nth-child(3){animation-delay:-3s}
.tea-topping{opacity:0;transition:opacity .4s}.tea-petals{transition:opacity .4s}
.tea-setting[data-blend=cocoa]{--brew-light:#714131;--brew-dark:#35231d}.tea-setting[data-blend=cocoa] .tea-topping{opacity:1}.tea-setting[data-blend=cocoa] .tea-petals{opacity:0}
.tea-setting[data-blend=chamomile]{--brew-light:#e2b552;--brew-dark:#966825}.tea-setting[data-blend=chamomile] .tea-petals{fill:#f3dda2}
#place .activity-intro{font-style:italic;color:var(--room-muted);margin:20px 0 15px}
#place .tea-menu{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-block:1px solid #ccb48830;margin:0}
#place .tea-menu button{height:auto;width:100%;text-align:left;padding:13px 9px 14px;background:transparent;border-bottom:2px solid transparent;color:var(--room-muted);font-family:Georgia,serif;transition:background .2s,color .2s}
#place .tea-menu button+button{border-left:1px solid #ccb48820}
.tea-menu button>span{display:block;font-size:9px;letter-spacing:1px;margin-bottom:7px;opacity:.7}.tea-menu strong{display:block;font-size:14px;font-weight:normal}.tea-menu small{display:block;font-size:10px;margin-top:6px}
#place .tea-menu [aria-pressed=true]{border-bottom-color:var(--room-accent);background:#d5b7840c;color:#f5dec1}
#place .tea-menu button:hover{background:#d5b78415}.tea-menu button:focus-visible{outline:2px solid var(--room-accent);outline-offset:-3px}
#place #tea-note{font-size:13px;line-height:1.6;color:var(--room-muted);min-height:42px;margin:16px 0 0}
.storybook-leaf{background:linear-gradient(110deg,#e1d0b7,#f4e7d1 8%,#f1e3c9 93%,#d7c4a5);color:#4c3d46;padding:22px 26px 28px;box-shadow:0 4px 12px #0003;border-radius:2px 7px 7px 2px;border-left:5px solid #ad91b2}
.storybook-leaf .fiction-label{font:8px/1.5 Georgia,serif;letter-spacing:1.5px;text-align:center;color:#785c76;margin:0}
.book-ornament{display:block;font-size:32px;text-align:center;color:#92718c;margin:10px 0}
#place #story-page{font:17px/1.8 Georgia,serif;min-height:145px;text-wrap:pretty}
#place[data-activity=lock] #lock-rings{display:flex;justify-content:center;gap:18px;background:radial-gradient(ellipse,#d5ad5420,transparent 70%);padding:22px 0}
#place #lock-rings button{width:72px;height:72px;border-radius:50%;font-size:30px!important;background:radial-gradient(circle,#172132 53%,#b39059 55%,#413428 58%,#c6a365 62%,#392e24 65%);border:1px solid #d2b072!important;box-shadow:0 4px 9px #0005,inset 0 0 0 5px #b3905922;color:#efd397;transition:transform .2s}
#place #lock-rings button:hover{transform:rotate(10deg)}
#place #sketch.star-sky{border-radius:50%;border:7px solid #8c734c;outline:1px solid #dfbc78;outline-offset:3px;box-shadow:0 0 0 9px #181d26,0 8px 20px #0005;margin:22px 0}
#place[data-activity=drawing] #sketch{border-radius:2px;box-shadow:0 5px 12px #0003;border:8px solid #d7c4a4}
@keyframes tea-breathe{0%,100%{opacity:.15;transform:translateY(4px)}50%{opacity:.5;transform:translateY(-7px)}}
@media(max-width:600px){#place{padding:22px;max-height:calc(100dvh - 28px);width:calc(100% - 28px)}#place #title{font-size:25px;margin-bottom:18px}.tea-setting{margin-inline:-22px;height:200px}.tea-illustration{height:190px}#place .tea-menu button{padding-inline:7px}.tea-menu strong{font-size:13px}.tea-menu small{font-size:9px}.storybook-leaf{padding:20px}.tea-scene-caption{bottom:8px}}
@media(prefers-reduced-motion:reduce){.tea-steam path{animation:none;opacity:.35}#place *{transition:none!important}}