/* Quiet spatial UI. Native CSS, original game sprites. Cards 24px; controls pill.
   Design variance 5, motion 4, density 2. Layers inherit the existing modal system. */
:root,[data-background]{--ink:#405557;--muted:#617779;--accent:#527b78;--accent-soft:#dce9e5;--bg:#eaf1ef;--paper:#f5f8f5;--line:#d5e1de;--sky:#dce9e6;--room:#dce7e3;font-family:'Avenir Next','PingFang SC','Microsoft YaHei',sans-serif}
[data-background=garden]{--bg:#e7eeea;--paper:#f3f7f1;--accent-soft:#dbe6d8}
[data-background=night]{--bg:#e5e8ef;--paper:#f3f4f8;--accent-soft:#dce2eb;--room:#d7dfeb}
body{background:var(--bg)}.room{background:linear-gradient(170deg,var(--paper),var(--bg) 58%,var(--room))}.room>*{display:none}.room:before,.room:after{content:'';position:absolute;width:85vw;height:40vw;border-radius:50%;background:#d2e1dd66;bottom:-24vw;left:-20vw;transform:rotate(-14deg)}.room:after{left:auto;right:-30vw;bottom:-20vw;background:#e6d9d466}
.desktop-note{display:none}button{transition:transform 220ms ease,background-color 220ms ease;box-shadow:none}button:active:not(:disabled){transform:scale(.98)}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.eyebrow{display:none!important}
dialog{color:var(--ink);background:var(--paper);border:1px solid #ffffff99;border-radius:28px;box-shadow:0 24px 90px #47635f24}dialog::backdrop{background:#dbe6e4ed}.sheet{background:none;padding:40px 26px 26px;max-height:85dvh}.sheet h2{font-size:25px;font-weight:500;letter-spacing:1px}.sheet p{color:var(--muted);font-size:14px}.sheet .sheet-close{background:transparent;border:0;color:var(--ink);right:12px;top:12px}.sheet .primary,.sheet .secondary{min-height:48px;border:0;border-radius:99px;font-size:14px;font-weight:500;box-shadow:none}.sheet .primary{background:var(--accent);color:#f8faf8}.sheet .secondary{background:var(--accent-soft);color:var(--ink)}
dialog.home-screen,dialog[data-page=levels]{width:min(100%,480px);height:100dvh;max-height:100dvh;overflow-y:auto;margin:auto;border:0;border-radius:0;background:transparent;box-shadow:none}
dialog.home-screen::backdrop,dialog[data-page=levels]::backdrop{background:linear-gradient(155deg,var(--paper),var(--bg) 65%,var(--room))}
dialog.home-screen .sheet,dialog[data-page=levels] .sheet{min-height:100dvh;max-height:none;overflow:visible;background:none;padding: max(28px,env(safe-area-inset-top)) 28px max(24px,env(safe-area-inset-bottom));display:flex;justify-content:center;flex-direction:column}
.home-heading{padding:12px 0 30px;text-align:center}.home-heading h1{margin:0}.home-heading h1 button{font-family:inherit;font-size:30px;font-weight:400;letter-spacing:5px;background:none;color:var(--ink)}.home-heading p{font-size:13px;letter-spacing:2px;margin:12px 0 0}
.room-choices{display:grid;gap:16px}.quiet-room{position:relative}.room-choice,.room-choice.sanrio,.room-choice.chiikawa{position:relative;isolation:isolate;min-height:126px;padding:18px 23px;gap:23px;border:1px solid #ffffffaa;border-radius:24px;background:#e0ece7;box-shadow:0 12px 26px -15px #68867f55;overflow:hidden;text-align:left}.room-choice.sanrio{background:#efe2df}.room-choice.chiikawa{background:#e7e9ee}
.room-choice:before{content:'';position:absolute;width:120px;height:31px;left:4px;bottom:19px;border-radius:50%;background:#f5faf5;box-shadow:0 9px 0 #c3d7cf,8px 19px 22px #79978c25;z-index:-1}.room-choice.sanrio:before{background:#fcf1ed;box-shadow:0 9px 0 #dfc8c2,8px 19px 22px #ad8e8525}.room-choice.chiikawa:before{background:#f4f5fa;box-shadow:0 9px 0 #cdd3e0,8px 19px 22px #8995b225}.room-choice img{width:75px;height:75px;object-fit:contain;filter:drop-shadow(0 7px 5px #6b7f7820);transform:translateY(-6px)}.room-choice span{flex:1}.room-choice strong{display:block;color:var(--ink);font-size:21px;font-weight:500;letter-spacing:1px}.room-choice small{display:block;font-size:12px;margin-top:9px;color:#5f7372}.room-choice b{font-size:24px;font-weight:400;color:#5f7372}.room-select{position:absolute;right:16px;bottom:2px;padding:0 8px;min-height:35px;background:none;color:#556b6b;font-size:11px;text-decoration:underline;text-underline-offset:4px}
.home-notice{min-height:12px;height:auto;margin:4px 0!important;font-size:12px!important}.home-notice:empty{height:0;min-height:0}.home-screen #home-continue{background:var(--accent);color:#f8faf8;min-height:48px;margin-top:20px;border:0}.home-tools{margin-top:22px;display:flex;gap:40px;justify-content:center}.home-tools button{background:none;border:0;border-radius:99px;min-width:60px;min-height:44px;color:var(--muted);font-size:13px;box-shadow:none}
.room-heading{display:flex;align-items:center;justify-content:center;gap:18px;margin:30px 0 35px;padding:0;border:0;background:none}.room-heading img{width:76px;height:76px;object-fit:contain}.room-heading h2{font-weight:400}.level-grid{gap:16px}.level-grid button{min-height:100px;border:1px solid #ffffffcc;border-radius:24px;background:var(--paper);box-shadow:0 8px 20px #66847b12}.level-grid strong{font-size:29px;font-weight:400;color:var(--ink)}.level-grid small{font-size:15px;color:var(--accent)}.level-grid button:disabled{opacity:.6;background:transparent;border-color:var(--line);box-shadow:none}.level-grid button:disabled small{font-size:12px}.sheet [data-level^=endless]{margin-top:30px;min-height:54px;font-size:15px}.sheet [data-level^=endless]:disabled{background:var(--accent-soft);color:var(--muted);opacity:1}
dialog[data-page=album] .sheet,dialog[data-page=settings] .sheet{background:none;padding:40px 24px 26px}.album-tabs{flex-wrap:wrap}.album-tabs button{min-height:44px;min-width:65px;border-radius:99px;color:var(--muted);font-size:12px}.album-tabs button[aria-selected=true]{background:var(--accent-soft);color:var(--ink)}.album-item{border:0;background:var(--accent-soft);border-radius:18px;padding:10px 3px}.album-item span{font-size:12px}.album-item small{font-size:11px;color:var(--muted)}.setting-row{min-height:56px;border-bottom:1px solid var(--line);font-size:14px}.setting-title{font-size:14px}.background-option{background:var(--accent-soft);border-radius:18px;font-size:12px}.special-grid .album-item p{font-size:12px}.stats small{color:var(--muted)}
.app{width:min(100%,450px);padding: max(8px,env(safe-area-inset-top)) 20px max(8px,env(safe-area-inset-bottom));grid-template-rows:40px 48px 52px minmax(0,1fr) 76px 0;gap:3px;background:transparent}.topbar .wordmark{font-size:14px;letter-spacing:2px;font-weight:400}.wordmark img,#settings,.best-block,.album-button,.save-note,.empty-hint small{display:none}.top-actions .icon-button{background:var(--paper)}.hud{padding:0 9px}.score-block{display:flex;align-items:baseline;gap:12px}.score-block>span{font-size:12px;letter-spacing:1px}.hud strong{font-size:30px;font-weight:400;color:var(--ink)}.mission{padding:4px 9px;border:0;background:none;border-radius:0;gap:18px}.mission>button span{font-size:11px}.mission>button strong{font-size:15px;font-weight:500}.mission-details>span{font-size:12px;color:var(--ink)}progress,progress::-webkit-progress-bar{background:#d4e0dd}progress::-webkit-progress-value{background:#789d94}progress::-moz-progress-bar{background:#789d94}.arena{border:0;background:none}.empty-hint{color:var(--muted);font-size:12px}.dock{grid-template-columns:1fr 130px!important;gap:30px;padding:8px 10px;background:none;border:0;border-radius:0}.energy-box>span{font-size:10px;letter-spacing:1px}.energy-box strong{font-size:21px;font-weight:400}.tornado{width:130px!important;height:52px!important;border:0;border-radius:99px;background:var(--accent-soft);color:var(--ink);box-shadow:none!important;animation:none!important;display:flex;flex-direction:row;gap:9px;align-items:center;justify-content:center}.tornado svg{width:25px;height:25px}.tornado>strong{display:none}.tornado>span{font-size:13px;margin:0}.tornado.ready{background:var(--accent);color:var(--paper)}.tornado:disabled{opacity:.7}.loading{background:var(--paper);color:var(--muted)}.chain{color:var(--accent);text-shadow:none}.chain small{display:none}.protection{background:var(--paper);color:var(--accent)}#toast{background:var(--paper);color:var(--ink)}
@media(hover:hover){.room-choice:hover{transform:translateY(-3px)}.home-tools button:hover,.room-select:hover{background:#ffffff66}.sheet .primary:hover{filter:brightness(1.06)}}
@media(prefers-reduced-motion:no-preference){#dialog-content{animation:quiet-enter 360ms cubic-bezier(.2,.7,.2,1)}.app:has(#game[data-phase=playing]) .arena{animation:quiet-enter 360ms ease-out}@keyframes quiet-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}}
@media(max-height:720px){dialog.home-screen .sheet{padding-top:20px;padding-bottom:16px;justify-content:flex-start}.home-heading{padding:8px 0 20px}.home-heading h1 button{font-size:27px}.room-choice{min-height:106px;padding-top:12px;padding-bottom:12px}.room-choice img{width:65px;height:65px}.room-choices{gap:12px}.home-tools{margin-top:12px}.home-screen #home-continue{margin-top:12px}.app{grid-template-rows:36px 40px 46px minmax(0,1fr) 65px 0}.room-choice:before{width:105px;height:25px;bottom:19px}}
@media(max-height:720px){.room-choice,.room-choice.sanrio,.room-choice.chiikawa{min-height:106px;padding-top:12px;padding-bottom:12px}}
@media(max-width:360px){dialog.home-screen .sheet,dialog[data-page=levels] .sheet{padding-left:20px;padding-right:20px}.room-choice{gap:14px;padding-left:18px}.room-choice strong{font-size:19px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}