/* Hallmark · genre: playful · macrostructure: Split Studio / Index-First · design-system: DESIGN.md · designed-as-app
 * Hallmark · pre-emit critique: P4 H4 E4 S5 R5 V4 */
@import url('/tokens.css');
html,body{overflow-x:clip}html:root{font-size:16px}
body.house-page{margin:0;background:var(--color-paper);color:var(--color-ink);font:var(--text-md)/1.65 var(--font-body)}
.house-page *{box-sizing:border-box}
.house-page [hidden]{display:none!important}
.house-page a{color:var(--color-accent)}
.house-page button,.house-page input,.house-page textarea{font:inherit}
.house-page button{cursor:pointer;white-space:nowrap}
.house-page button:disabled{cursor:not-allowed;opacity:.6}
.house-page :is(button,a,input,textarea,select):focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
.house-page h1,.house-page h2,.house-page h3{font-family:var(--font-display);font-style:normal;overflow-wrap:anywhere;line-height:1.3}
.house-page h1{font-size:var(--text-display);font-weight:700;margin:0}
.house-page h2{font-size:var(--text-xl);margin:0 0 var(--space-md)}
.house-page p{margin:0 0 var(--space-lg)}
.house-width{width:min(1180px,calc(100% - 80px));margin:auto}
.house-header{min-height:100px;display:flex;justify-content:space-between;align-items:center;gap:var(--space-lg);flex-wrap:wrap;padding-block:var(--space-lg)}
.house-brand{display:inline-flex;align-items:center;gap:var(--space-sm);text-decoration:none;white-space:nowrap;font:700 var(--text-lg)/1.4 var(--font-display);min-height:44px}
.house-brand img{width:40px;height:40px}
.house-header nav{display:flex;align-items:center;gap:var(--space-lg);flex-wrap:wrap}
.house-header nav a,.house-nav-link{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;white-space:nowrap;font-size:var(--text-sm)}
.house-header nav a[aria-current=page]{font-weight:700;text-decoration:underline;text-underline-offset:7px}
.house-button,.house-page .house-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);min-height:48px;border:1px solid var(--color-accent);border-radius:var(--radius-input);padding:var(--space-sm) var(--space-lg);background:var(--color-accent);color:var(--color-accent-ink);font-weight:600;text-decoration:none;white-space:nowrap;transition:transform var(--dur-micro) var(--ease-out)}
.house-button.secondary{background:transparent;color:var(--color-accent)}
.house-button:active{transform:translateY(1px)}
@media(hover:hover){.house-button:hover{transform:translateY(-2px)}.house-header nav a:hover{text-decoration:underline;text-underline-offset:7px}}
.house-button[aria-busy=true]{opacity:.7}
.door-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);align-items:center;gap:var(--space-2xl);min-height:calc(100svh - 205px);padding-block:var(--space-2xl)}
.door-copy h1{max-width:7em;margin-bottom:var(--space-lg);letter-spacing:.025em}
.door-copy>p{color:var(--color-ink-2);font-size:var(--text-lg);max-width:24em}
.door-actions{display:flex;align-items:center;gap:var(--space-lg);flex-wrap:wrap;margin-top:var(--space-xl)}
.door-note{margin-top:var(--space-2xl)!important;font-size:var(--text-sm)!important}
.house-scene{display:block;width:100%;height:auto;max-height:560px;overflow:visible}
.scene-ground{fill:var(--color-paper-2)}.scene-wall{fill:var(--color-surface)}.scene-roof{fill:var(--color-accent)}.scene-wood{fill:var(--color-wood)}.scene-wood-deep{fill:var(--color-wood-deep)}.scene-ink{fill:var(--color-ink)}.scene-water{fill:var(--color-water)}.scene-line{stroke:var(--color-rule);fill:none;stroke-width:2}
.house-footer{display:flex;justify-content:space-between;align-items:center;gap:var(--space-lg);padding-block:var(--space-xl);font-size:var(--text-sm);color:var(--color-ink-2)}
.house-skip{position:fixed;top:-100px;left:var(--space-md);z-index:5;background:var(--color-surface);padding:var(--space-md)}.house-skip:focus{top:var(--space-sm)}
.hall-intro{padding:var(--space-2xl) 0 var(--space-xl);display:flex;justify-content:space-between;align-items:end;gap:var(--space-lg);flex-wrap:wrap}
.hall-intro h1{font-size:clamp(1.7rem,4vw,3rem);margin-bottom:var(--space-md)}
.hall-intro p{color:var(--color-ink-2);margin:0;max-width:36em}
.hall-account{font-size:var(--text-sm);display:flex;align-items:center;gap:var(--space-md);flex-wrap:wrap}
.hall-account button{min-height:44px;padding:var(--space-sm) var(--space-md);background:transparent;border:1px solid var(--color-rule);border-radius:var(--radius-input);color:var(--color-accent)}
.hall-status{min-height:1.65em;font-size:var(--text-sm);color:var(--color-ink-2)}.hall-status.error{color:var(--color-error)}
.hall-status:empty{display:none}
.room-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--space-lg)}
.room-card{border-radius:var(--radius-card);padding:var(--space-xl);min-width:0;background:var(--color-surface);display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:var(--space-lg);align-items:center;min-height:245px}
.room-card.wishes{background:var(--color-water);grid-template-columns:minmax(0,1fr) 120px}
.room-card h2{font-size:var(--text-2xl);margin-bottom:var(--space-sm)}
.room-card p{color:var(--color-ink-2);font-size:var(--text-sm);max-width:25em;margin-bottom:var(--space-lg)}
.room-state{display:block;font-size:var(--text-xs);color:var(--color-ink-2);margin:0 0 var(--space-sm)}
.room-art{width:100%;height:150px;color:var(--color-accent)}
.room-request-note{margin-top:var(--space-md)!important;margin-bottom:0!important;overflow-wrap:anywhere}
.waiting-rooms{margin-top:var(--space-2xl)}.waiting-rooms h2{font-size:var(--text-lg)}
.waiting-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-lg)}
.waiting-room{padding:var(--space-lg);background:var(--color-paper-2);border-radius:var(--radius-card)}
.waiting-room h3{font-size:var(--text-lg);margin:0 0 var(--space-sm)}.waiting-room p{font-size:var(--text-sm);margin:0;color:var(--color-ink-2)}.waiting-room small{display:block;margin-top:var(--space-md);font-size:var(--text-xs);color:var(--color-ink-2)}
.hall-feedback{margin-top:var(--space-2xl);max-width:820px}.hall-feedback h2{font-size:var(--text-lg)}
.hall-message{padding:var(--space-md) 0;border-bottom:1px solid var(--color-rule);overflow-wrap:anywhere}.hall-message p{margin:0;font-size:var(--text-sm)}.hall-message small{font-size:var(--text-xs);color:var(--color-ink-2)}
.house-dialog{width:min(490px,calc(100% - 32px));max-height:90svh;overflow:auto;border:0;border-radius:var(--radius-card);padding:var(--space-xl);background:var(--color-surface);color:var(--color-ink)}.house-dialog::backdrop{background:var(--color-overlay)}
.house-dialog h2{margin:0 0 var(--space-lg);font:700 var(--text-xl)/1.3 var(--font-display)}
.house-dialog label{display:block;font-size:var(--text-sm);margin-bottom:var(--space-sm)}
.house-dialog textarea{width:100%;background:var(--color-paper);color:var(--color-ink);border:1px solid var(--color-rule);border-radius:var(--radius-input);padding:var(--space-md);resize:vertical}
.house-dialog .dialog-actions{display:flex;justify-content:end;gap:var(--space-md);margin-top:var(--space-lg);flex-wrap:wrap}.house-dialog .hall-status{margin-top:var(--space-md)}
.house-page.house-interior{--bg:var(--color-paper);--paper:var(--color-surface);--ink:var(--color-ink);--muted:var(--color-ink-2);--green:var(--color-accent);--green-light:var(--color-paper-2);--line:var(--color-rule)}
.house-interior .house-header{background:var(--color-surface);padding-inline:var(--space-xl);border-bottom:1px solid var(--color-rule);min-height:90px}
.house-interior .house-header nav{gap:var(--space-md)}
.house-interior .pool-shell>.house-header{padding-inline:0;background:transparent}
.house-interior .admin-shell>header{display:flex;gap:var(--space-lg);align-items:center;flex-wrap:wrap}
.house-interior .admin-shell{max-width:1120px}
.console-tabs{display:flex;gap:var(--space-sm);flex-wrap:wrap;margin:var(--space-xl) 0}
.console-tabs button{min-height:44px;padding:var(--space-sm) var(--space-md);border:1px solid var(--color-rule);background:transparent;color:var(--color-accent);border-radius:var(--radius-input)}
.console-tabs button[aria-selected=true]{background:var(--color-accent);color:var(--color-accent-ink);border-color:var(--color-accent)}
.module-member,.module-request{padding:var(--space-lg) 0;border-bottom:1px solid var(--color-rule);overflow-wrap:anywhere}
.module-member h3,.module-request h3{font:600 var(--text-md)/1.5 var(--font-body);margin:0 0 var(--space-sm)}
.module-member small,.module-request small{display:block;color:var(--color-ink-2);margin-bottom:var(--space-md)}
.permission-actions{display:flex;gap:var(--space-md);align-items:center;flex-wrap:wrap}
.permission-actions button{min-height:44px;padding:var(--space-sm) var(--space-md);border:1px solid var(--color-rule);border-radius:var(--radius-input);background:var(--color-paper);color:var(--color-accent)}
.permission-actions button[data-allowed=true]{background:var(--color-paper-2)}
.error-page{max-width:700px;margin:10vh auto;padding:var(--space-xl);font-family:var(--font-body)}
.reading-account{display:flex;align-items:center;justify-content:end;gap:var(--space-md);padding:var(--space-sm) var(--space-xl);font-size:var(--text-xs);background:var(--color-paper)}
.reading-account a{min-height:44px;display:inline-flex;align-items:center;white-space:nowrap;text-decoration:none}
.house-interior .login-shell .intro h1{font-size:clamp(2rem,4vw,3.2rem);letter-spacing:0;margin-top:var(--space-2xl)}
.login-house-art{width:min(100%,370px);height:auto;display:block;margin-top:var(--space-xl)}
.permissions-heading{margin-top:var(--space-xl)!important}
.house-interior :is(.hint,.list-row small,.empty,.code-box p){font-size:var(--text-sm);color:var(--color-ink-2)}
.house-interior .feedback{font-size:var(--text-sm);color:var(--color-error)}.house-interior .feedback.success{color:var(--color-accent)}
.house-interior label{font-size:var(--text-sm)}
.house-interior .list-row strong{font-size:var(--text-md)}
.house-interior .text-button{font-size:var(--text-sm);min-height:44px}
.house-interior :is(.row-actions button,.secondary,.primary,dialog button){min-height:44px;font-size:var(--text-sm)}
.house-interior .reading-area h1{font-size:clamp(1.8rem,3vw,2.4rem)}
.house-interior .pool-intro h1{font-size:clamp(2.2rem,4vw,3.5rem)}
@media(max-width:680px){.login-house-art{display:none}.house-interior .login-shell .intro h1{margin-top:var(--space-lg)}.house-interior .admin-shell .house-header{padding-inline:0}.house-interior .section-heading{flex-wrap:wrap}}
@media(max-width:950px){.room-grid{grid-template-columns:minmax(0,1fr)}.room-card,.room-card.wishes{grid-template-columns:minmax(0,1fr) 180px}.door-layout{gap:var(--space-lg)}}
@media(max-width:680px){.house-width{width:calc(100% - 40px)}.house-header{gap:var(--space-sm);padding-block:var(--space-md);min-height:80px}.house-brand{font-size:var(--text-md)}.house-brand img{width:32px;height:32px}.house-header nav{gap:var(--space-md)}.door-layout{grid-template-columns:minmax(0,1fr);padding-top:var(--space-xl);min-height:0;gap:var(--space-xl)}.door-copy h1{max-width:none;font-size:clamp(2rem,7.7vw,3rem)}.door-copy>p{font-size:var(--text-md)}.door-note{margin-top:var(--space-lg)!important}.house-scene{max-height:340px}.house-footer{flex-wrap:wrap;padding-block:var(--space-lg)}.hall-intro{padding-top:var(--space-xl)}.room-card,.room-card.wishes{padding:var(--space-lg);grid-template-columns:minmax(0,1fr) 95px;gap:var(--space-sm)}.room-card h2{font-size:var(--text-xl)}.room-art{height:100px}.room-card p{font-size:var(--text-sm)}.waiting-list{grid-template-columns:minmax(0,1fr)}.house-interior .house-header{padding-inline:var(--space-md)}.house-interior .house-header nav{gap:var(--space-sm)}.house-header nav a{font-size:var(--text-xs)}.hall-account{gap:var(--space-sm)}}
@media(prefers-reduced-motion:reduce){.house-page *, .house-page *::before,.house-page *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.house-button:hover,.house-button:active{transform:none}}
