.human-shell{height:100dvh;display:flex;flex-direction:column;overflow:hidden;background:var(--paper);color:var(--ink)}
/* Player introduction and GM preview share the exact same viewport layout. */
.human-intro-shell{position:fixed;inset:0;width:100%;height:100dvh;min-width:0;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;overflow:hidden;background:#101714;color:#fff6e5}
dialog.human-intro-preview[open]{display:block;box-shadow:none;transform:none;animation:none}
.human-intro{position:relative;isolation:isolate;width:100%;height:100%;overflow:hidden;background:#101714}
.human-intro-background,.human-intro-fallback,.human-intro-shade{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.human-intro-background{object-fit:cover;object-position:center;filter:none}
.human-intro-fallback{background:radial-gradient(ellipse at 78% 26%,#75613e55,transparent 55%),radial-gradient(ellipse at 30% 70%,#29534c66,transparent 65%),#101714}
.human-intro-shade{background:linear-gradient(90deg,#08100de6 0%,#08100dc4 35%,#08100d4d 78%,#08100d33),linear-gradient(0deg,#08100de8 0%,transparent 80%)}
.human-intro-inner{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:clamp(20px,3vh,36px);width:min(100%,900px);height:100%;padding:clamp(24px,5vh,60px) clamp(24px,6vw,96px);padding-bottom:max(24px,env(safe-area-inset-bottom));min-height:0}
.human-intro-top{display:flex;flex-direction:column;gap:8px;margin-bottom:auto;padding-bottom:20px;padding-right:110px;flex-shrink:0}
.human-intro-top .eyebrow{color:#e6d5b2;font-size:12px;letter-spacing:2.4px;overflow-wrap:anywhere}
.human-intro-chapter{color:#dbdbd0;font-size:12px;letter-spacing:1px}
.human-intro-copy{min-height:0;max-height:68dvh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#bfb29866 transparent;padding-right:16px;outline-offset:-3px}
.human-intro h1{font-family:var(--serif);font-size:clamp(32px,4.2vw,60px);line-height:1.12;letter-spacing:-.025em;margin:0 0 24px;color:#fff6e5;text-wrap:balance;overflow-wrap:anywhere;text-shadow:0 2px 18px #0008}
.human-intro-prose{font-family:var(--serif);font-size:clamp(18px,1.4vw,22px);line-height:1.85;color:#f2eddf;text-shadow:0 1px 8px #000b}
.human-intro-prose p{margin:0 0 1.15em;white-space:pre-wrap;overflow-wrap:anywhere}.human-intro-prose p:last-child{margin-bottom:0}
.human-intro-footer{flex-shrink:0}.human-intro-progress{display:flex;gap:6px;margin-bottom:20px;max-width:240px}.human-intro-progress span{height:3px;flex:1;border-radius:8px;background:#ffffff33}.human-intro-progress .current{background:#e7c489}.human-intro-progress .read{background:#e7c48988}
.human-intro-navigation{display:flex;align-items:center;justify-content:space-between;gap:12px}
.human-intro .btn,.human-intro-preview-close.btn{color:#f9f2e5;background:#13201ccc;border-color:#ebdaba66;min-height:46px;padding:12px 22px;white-space:nowrap;box-shadow:none;backdrop-filter:blur(8px)}
.human-intro .btn.primary{color:#1e281f;background:#e8cf9c;border-color:#e8cf9c}
.human-intro .btn:hover:not(:disabled),.human-intro-preview-close.btn:hover:not(:disabled){background:#35483af0;color:#fff6e5;border-color:#ebdaba}
.human-intro .btn.primary:hover:not(:disabled){background:#f5dfb5;color:#1e281f}
.human-intro .btn:focus-visible,.human-intro-preview-close.btn:focus-visible{outline:3px solid #f5dcab;outline-offset:3px}
.human-intro-preview-close.btn{position:absolute;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));font-size:12px;padding:8px 12px;min-height:40px;z-index:2}
@media(prefers-reduced-motion:no-preference){.human-intro-copy{animation:human-prologue-enter .45s ease-out}@keyframes human-prologue-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}}
@media(max-width:760px){.human-intro-inner{width:100%;padding:24px 22px max(20px,env(safe-area-inset-bottom));gap:20px}.human-intro-top{padding-top:max(36px,env(safe-area-inset-top));padding-right:0;gap:6px}.human-intro-top .eyebrow{font-size:10px;letter-spacing:1.8px}.human-intro-copy{max-height:64dvh;padding-right:8px}.human-intro h1{font-size:clamp(30px,8vw,42px);margin-bottom:18px}.human-intro-prose{font-size:18px;line-height:1.75}.human-intro-shade{background:linear-gradient(0deg,#08100df5 0%,#08100dba 55%,#08100d66),linear-gradient(90deg,#08100d66,transparent)}.human-intro-progress{margin-bottom:16px}.human-intro .btn{padding:10px 16px;font-size:14px}}
@media(max-height:520px){.human-intro-inner{padding-top:14px;gap:12px}.human-intro-top{padding-top:0;padding-bottom:0;padding-right:180px;gap:3px}.human-intro h1{font-size:30px;margin-bottom:12px}.human-intro-copy{max-height:none}.human-intro-prose{font-size:17px;line-height:1.65}.human-intro-progress{margin-bottom:10px}}
.human-mobile-controls{display:none}.human-composer .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.human-header{display:flex;align-items:center;gap:16px;padding:20px clamp(16px,3vw,48px);border-bottom:1px solid var(--line);flex-shrink:0}
.human-header h1{font-size:clamp(21px,2.2vw,32px);margin:3px 0;overflow-wrap:anywhere}.human-header>div:nth-child(2){flex:1;min-width:0}.human-brand{background:transparent;border:0;color:var(--gold);width:44px;flex-shrink:0}.human-brand svg{width:36px;height:44px}
.human-nav{display:flex;gap:8px;overflow-x:auto;padding:12px clamp(16px,3vw,48px);flex-shrink:0}.human-nav .btn{flex-shrink:0;white-space:nowrap}
.human-content{flex:1;min-height:0;overflow:auto;padding:20px clamp(16px,3vw,48px) 36px}.human-table-content{padding-top:0;padding-bottom:16px;overflow:hidden}
.human-table{height:100%;display:flex;flex-direction:column;gap:12px;max-width:1280px;margin:auto}.human-table-toolbar{display:flex;align-items:end;flex-wrap:wrap;gap:10px;flex-shrink:0}.human-table-toolbar label{flex:1;min-width:160px;max-width:420px}.human-timeline{flex:1;min-height:80px;overflow-y:auto;overscroll-behavior:contain;padding:8px 12px 8px 0}.human-timeline .message{max-width:none;margin:0 0 12px}.human-timeline .message p{font-size:clamp(16px,1.15vw,20px);line-height:1.65}
.human-composer{display:grid;grid-template-columns:180px minmax(0,1fr);gap:12px;flex-shrink:0}.human-composer>.row{grid-column:1/-1;justify-content:flex-end}.human-compose-text textarea{min-height:74px;max-height:200px;resize:vertical}.human-rolls{display:flex;gap:8px;max-height:180px;overflow:auto}.human-rolls:empty{display:none}.human-rolls .info-box{min-width:220px;flex:1}
.human-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr));gap:20px;margin-top:20px}.human-grid .card{min-width:0}.human-hero{padding:0;overflow:hidden}.human-hero .profile-hero{height:260px;min-height:0;border-radius:0}.human-hero .profile-hero img{width:100%;height:100%;object-fit:cover}.human-card-body{padding:20px}.human-grid h2{font-size:24px}.human-note-image{width:100%;height:200px;object-fit:cover;border-radius:12px;margin-bottom:16px}.human-note p{line-height:1.6}.human-targets{border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;gap:12px;flex-wrap:wrap}.human-targets legend{padding:0 6px;font-size:14px}.human-targets label{margin:0}
.human-desk-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.human-ai-draft,.human-log,#human-plot-guidance{margin-top:20px}.human-ai-draft textarea{min-height:240px}.human-welcome{display:flex;align-items:center;gap:16px;margin:0 clamp(16px,3vw,48px) 16px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}.human-welcome p{margin:6px 0 0}.human-welcome>div{flex:1}
.human-event{padding:12px;text-align:center}.human-event>img{display:block;width:100%;max-height:58dvh;object-fit:contain;border-radius:12px;margin:0 auto 24px}.human-event .note-body{max-width:760px;margin:20px auto;line-height:1.8}.human-event.document{text-align:left}.human-event .stack{max-width:600px;margin:24px auto}#modal[data-kind=human-event]{width:min(1100px,94vw)}
@media(prefers-reduced-motion:no-preference){.human-event{animation:human-enter .4s ease-out}@keyframes human-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}}
@media(max-width:760px){.human-header{padding:12px;gap:10px}.human-header .row{gap:4px;flex-wrap:wrap;justify-content:flex-end}.human-header .row .btn{font-size:12px;min-height:34px;padding:6px 8px}.human-brand{display:none}.human-nav{padding:8px 12px;gap:6px}.human-nav .btn{padding:8px 10px;font-size:13px;min-height:36px}.human-content{padding:12px}.human-table{gap:8px}.human-table-toolbar{gap:6px}.human-table-toolbar .btn{font-size:12px;min-height:32px;padding:6px 8px}.human-table-toolbar label{max-width:none;font-size:11px}.human-table-toolbar select{min-height:34px;padding:5px}.human-timeline{padding-right:0}.human-timeline .message{padding:14px}.human-composer{grid-template-columns:110px minmax(0,1fr);gap:6px}.human-composer select{font-size:12px;padding:8px}.human-composer label{font-size:12px}.human-composer textarea{font-size:16px;min-height:62px;max-height:120px}.human-composer>.row{gap:6px}.human-composer>.row .btn{min-height:34px;font-size:13px}.human-welcome{flex-wrap:wrap;margin:0 12px 8px;padding:10px;font-size:13px}.human-welcome p{display:none}.human-desk-grid{grid-template-columns:1fr}.human-rolls{max-height:130px}.human-grid{gap:14px}.human-event{padding:0}}

@media(max-width:760px){.human-header h1{font-size:20px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.human-header .eyebrow{font-size:9px;letter-spacing:1px;white-space:nowrap}.human-header>div:last-child{max-width:140px}.human-table-toolbar>.btn{display:none}.human-table-toolbar>.human-mobile-controls{display:inline-flex}.human-composer{grid-template-columns:minmax(0,1fr)}.human-compose-options{position:relative;border:1px solid var(--line);border-radius:10px;font-size:12px}.human-compose-options summary{padding:6px 10px;cursor:pointer}.human-compose-options[open] .stack{position:absolute;bottom:100%;left:0;right:0;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px;max-height:45dvh;overflow:auto;z-index:5}.human-composer textarea{height:62px;min-height:62px}.human-table-toolbar label{min-width:130px}.human-timeline{min-height:0}.human-table-toolbar .badge{display:none}}