:root{--bg:#e9dfc7;--panel:#f6efdd;--panel-2:#efe4c8;--ink:#2b2318;--ink-soft:#5c5238;--rule:#b7a179;--rule-soft:#d8c79c;--brass:#9c6b2e;--brass-light:#c9903f;--arcane:#2f6d74;--arcane-light:#5fa1a8;--danger:#7c3232;--danger-light:#a85252;--good:#4b6b2e;--shadow:0 1px 0 #2b231814;--font-display:Georgia, "Iowan Old Style", "Palatino Linotype", serif;--font-body:"Segoe UI", Tahoma, system-ui, sans-serif;--font-mono:"Consolas","SFMono-Regular", Menlo, monospace;--radius:10px}*{box-sizing:border-box}body{color:var(--ink);font-family:var(--font-body);margin:0}#app{background:var(--bg);border:1px solid var(--rule);background-image:radial-gradient(circle at 20px 20px,#9c6b2e0d 1px,#0000 1px);background-size:22px 22px;border-radius:16px;padding:0;overflow:hidden}.topbar{background:var(--panel-2);border-bottom:2px solid var(--brass);flex-wrap:wrap;align-items:center;gap:10px;padding:12px 16px;display:flex}.topbar .brandmark{font-family:var(--font-display);color:var(--brass);letter-spacing:.03em;white-space:nowrap;align-items:center;gap:8px;font-size:15px;font-weight:700;display:flex}.cog{border:2px solid var(--brass);border-radius:50%;flex:none;width:16px;height:16px;display:inline-block;position:relative}.cog:before{content:"";border:1px dashed var(--brass-light);opacity:.6;border-radius:50%;position:absolute;inset:-4px}select,input[type=text],input[type=number],textarea{font-family:var(--font-body);color:var(--ink);border:1px solid var(--rule);background:#fffdf6;border-radius:6px;padding:5px 7px;font-size:13px}select:focus,input:focus,textarea:focus{outline:2px solid var(--arcane-light);outline-offset:1px}.topbar select{max-width:180px}.spacer{flex:1}.btn{font-family:var(--font-body);color:var(--ink);border:1px solid var(--rule);cursor:pointer;white-space:nowrap;background:#fffdf6;border-radius:6px;padding:6px 10px;font-size:12.5px;font-weight:600}.btn:hover{border-color:var(--brass-light);background:#fff8e8}.btn.brass{background:var(--brass);color:#fff8ea;border-color:var(--brass)}.btn.brass:hover{background:var(--brass-light)}.btn.danger{color:var(--danger)}.btn.danger:hover{border-color:var(--danger-light);background:#fbe9e9}.btn.small{padding:3px 7px;font-size:11.5px}.savestate{color:var(--ink-soft);white-space:nowrap;font-size:11px;font-style:italic}.lang-toggle{border:1px solid var(--rule);border-radius:6px;display:flex;overflow:hidden}.lang-btn{font-family:var(--font-mono);color:var(--ink-soft);cursor:pointer;background:#fffdf6;border:none;padding:6px 9px;font-size:11.5px;font-weight:700}.lang-btn.active{background:var(--brass);color:#fff8ea}.tabs{background:var(--panel-2);border-bottom:1px solid var(--rule);gap:2px;padding:0 16px;display:flex}.tab{font-family:var(--font-display);cursor:pointer;color:var(--ink-soft);-webkit-user-select:none;user-select:none;border-bottom:3px solid #0000;padding:9px 16px;font-size:13.5px}.tab.active{color:var(--brass);border-bottom-color:var(--brass);font-weight:700}.tab:hover{color:var(--ink)}.page{padding:16px;display:none}.page.active{display:block}.panel{background:var(--panel);border:1px solid var(--rule);border-radius:var(--radius);box-shadow:var(--shadow);min-width:0;margin-bottom:12px;padding:10px 12px;position:relative}.panel-title{font-family:var(--font-display);letter-spacing:.09em;text-transform:uppercase;color:var(--brass);border-bottom:1px solid var(--rule-soft);margin-bottom:8px;padding-bottom:5px;font-size:11px;font-weight:700}.grid{gap:12px;display:grid}.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:1fr 1fr 1fr}.g12{grid-template-columns:repeat(12,1fr)}.grid-flow{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}@media (width<=760px){.g3{grid-template-columns:1fr 1fr}.g12{grid-template-columns:repeat(6,1fr)}}@media (width<=520px){.g2,.g3{grid-template-columns:1fr}.g12{grid-template-columns:repeat(3,1fr)}}.sheet-top{grid-template-columns:repeat(5,minmax(0,1fr));align-items:start;gap:10px;min-width:0;display:grid}@media (width<=900px){.sheet-top{grid-template-columns:repeat(2,1fr)}}@media (width<=560px){.sheet-top{grid-template-columns:1fr}}.stack{flex-direction:column;gap:10px;min-width:0;display:flex}.compact .row-line{padding:2px 0;font-size:11.5px}.compact .panel-title{margin-bottom:5px}.roll-mini{border-radius:5px;width:20px;height:20px;font-size:9px}.flags-grid{grid-template-columns:repeat(5,18px);gap:4px;display:grid}.flags-grid label{color:var(--ink-soft);text-transform:uppercase;flex-direction:column;align-items:center;gap:1px;font-size:9px;display:flex}.flags-grid input{width:13px;height:13px;accent-color:var(--brass)}.flags-header{text-transform:uppercase;color:var(--ink-soft);text-align:center;grid-template-columns:repeat(5,18px);gap:4px;font-size:9px;display:grid}.icon-btn.cast{color:var(--arcane)}.icon-btn.hidden-slot{visibility:hidden}.spellslot-row{border-bottom:1px dotted var(--rule-soft);grid-template-columns:62px 108px 1fr;align-items:center;column-gap:6px;padding:3px 0;font-size:12.5px;display:grid}.spellslot-row .rname{font-weight:600}.portrait-box{border:1px solid var(--rule);background-color:#fffdf6;background-position:50%;background-size:cover;border-radius:8px;flex:none;width:170px;height:170px}.prep-row{border-bottom:1px dotted var(--rule-soft);opacity:.5;align-items:center;gap:8px;padding:4px 2px;display:flex}.prep-row.active{opacity:1}.prep-row .pname{flex:1;min-width:0;font-size:12.5px}.spell-summary{min-width:0;color:var(--ink-soft);-webkit-line-clamp:3;-webkit-box-orient:vertical;flex:1;font-size:11.5px;line-height:1.35;display:-webkit-box;overflow:hidden}.prep-badge{font-family:var(--font-mono);color:var(--ink-soft);border:1px solid var(--rule-soft);white-space:nowrap;background:#fffdf6;border-radius:5px;padding:1px 5px;font-size:10px}.action-slots{grid-template-columns:repeat(5,26px);gap:4px;display:grid}.icon-btn.cast-pact{color:#7b3fa0}.mastery-badge{font-family:var(--font-mono);color:var(--arcane);border:1px solid var(--rule-soft);background:#fffdf6;border-radius:5px;padding:1px 5px;font-size:9.5px}.picker-list{border:1px solid var(--rule-soft);border-radius:8px;max-height:320px;margin-top:6px;overflow-y:auto}.picker-item{border-bottom:1px dotted var(--rule-soft);cursor:pointer;align-items:center;gap:8px;padding:6px 8px;display:flex}.picker-item:hover{background:#fff2d6}.picker-item:last-child{border-bottom:none}.picker-item .pname{flex:1;font-size:12.5px}.picker-item .pmeta{color:var(--ink-soft);font-size:10.5px;font-family:var(--font-mono)}.picker-tabs{gap:4px;margin-top:8px;display:flex}.picker-tab{border:1px solid var(--rule);cursor:pointer;background:#fffdf6;border-radius:20px;padding:4px 10px;font-size:12px}.picker-tab.active{background:var(--brass);color:#fff8ea;border-color:var(--brass)}.class-row{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:5px;display:flex}.class-row select{max-width:150px}label.f{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;flex-direction:column;gap:2px;font-size:10.5px;display:flex}label.f>span.flabel{display:block}label.f input,label.f select{font-size:13px}label.f textarea{resize:vertical;font-size:13px;font-family:var(--font-body)}.ability-stack{flex-direction:column;gap:8px;display:flex}.ability-box{border:1px solid var(--rule);text-align:center;background:#fffdf6;border-radius:8px;justify-content:space-between;align-items:center;gap:8px;padding:8px;display:flex}.ability-box .lbl{letter-spacing:.06em;color:var(--ink-soft);text-transform:uppercase;text-align:left;flex:1;font-size:10.5px}.ability-box input.score{text-align:center;width:56px;font-size:20px;font-family:var(--font-mono);border:1px solid var(--rule-soft);color:var(--ink);background:#fff;border-radius:6px;padding:4px 2px;font-weight:700}.ability-box .mod{font-family:var(--font-mono);color:var(--arcane);min-width:34px;font-size:16px;font-weight:700}.row-line{border-bottom:1px dotted var(--rule-soft);grid-template-columns:16px 1fr 38px 36px 22px;align-items:center;column-gap:5px;padding:3px 0;font-size:12.5px;display:grid}.row-line.skill{grid-template-columns:16px 16px 1fr 38px 36px 22px}.row-line:last-child{border-bottom:none}.chk{cursor:pointer;width:14px;height:14px;accent-color:var(--brass)}.chk.expertise{accent-color:var(--arcane)}.chk[disabled]{opacity:.3;cursor:not-allowed}.val{font-family:var(--font-mono);text-align:right;color:var(--arcane);font-size:13px;font-weight:700}.rname{overflow-wrap:break-word;min-width:0}.misc-input{width:100%;padding:2px 3px;font-size:11px}.tiles{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.tile{border:1px solid var(--rule);text-align:center;background:#fffdf6;border-radius:8px;padding:8px}.tile .lbl{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em;font-size:10px}.tile .big{font-family:var(--font-mono);color:var(--ink);font-size:22px;font-weight:700}.tile input{text-align:center;width:100%;font-family:var(--font-mono);background:0 0;border:none;font-size:20px;font-weight:700}.maxrow{align-items:baseline;gap:5px;display:flex}.maxrow .die{color:var(--ink-soft);text-transform:none;font-size:10.5px;font-weight:400}.hprow{justify-content:center;align-items:center;gap:8px;display:flex}.hprow input{text-align:center;width:56px;font-family:var(--font-mono);font-size:18px}.hprow .slash{color:var(--ink-soft)}table.sheet{border-collapse:collapse;width:100%;font-size:12.5px}table.sheet th{text-align:left;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);border-bottom:1px solid var(--rule);padding:4px 5px;font-size:10px}table.sheet td{border-bottom:1px dotted var(--rule-soft);vertical-align:top;padding:4px 5px}table.sheet input,table.sheet select{width:100%;padding:3px 4px;font-size:12px}table.sheet textarea{width:100%;min-height:28px;font-size:12px}table.sheet input.mini{margin-bottom:3px}.icon-btn{border:1px solid var(--rule);cursor:pointer;background:#fffdf6;border-radius:6px;flex:none;justify-content:center;align-items:center;width:26px;height:24px;font-size:11px;line-height:1;display:inline-flex}.icon-btn:hover{border-color:var(--brass-light);background:#fff2d6}.icon-btn.roll{color:var(--arcane)}.icon-btn.info{color:var(--brass)}.icon-btn.del{color:var(--danger);border-color:var(--danger-light);background:#fbe9e9}.icon-btn.del:hover{background:#f6d0d0}.detail{border:1px solid var(--rule-soft);background:#fbf3de;border-radius:7px;margin-top:4px;padding:7px 9px;display:none}.detail.open{display:block}.detail textarea{border:1px solid var(--rule-soft);width:100%;min-height:56px}.detail .dlabel{text-transform:uppercase;color:var(--ink-soft);letter-spacing:.05em;margin-bottom:3px;font-size:10px}.feature-item{border-bottom:1px dotted var(--rule-soft);padding:6px 0}.feat-group-head{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:6px;align-items:center;gap:6px;margin:10px 0 4px;padding:3px 4px;display:flex}.feat-group-head:hover{background:#fff2d6}.feat-group-head .chev{color:var(--brass);transition:transform .15s;display:inline-block}.feat-group.collapsed .feat-group-head .chev{transform:rotate(-90deg)}.feat-group.collapsed .feat-group-body{display:none}.feat-count{font-family:var(--font-mono);color:var(--ink-soft);border:1px solid var(--rule-soft);background:#fffdf6;border-radius:10px;margin-left:auto;padding:0 6px;font-size:10px}.feature-item:last-child{border-bottom:none}.feature-head{align-items:center;gap:6px;display:flex}.feature-head input.fname{font-weight:700;font-family:var(--font-display);text-overflow:ellipsis;background:0 0;border:none;flex:1;min-width:0;padding:2px 3px;font-size:13.5px;overflow:hidden}.feature-head input.fname:hover,.feature-head input.fname:focus{border:1px solid var(--rule);background:#fffdf6}.add-row-btn{margin-top:6px}.pillbar{flex-wrap:wrap;gap:6px;display:flex}.pill{border:1px solid var(--rule);background:#fffdf6;border-radius:20px;align-items:center;gap:6px;padding:3px 10px;font-size:12px;display:flex}.pill button{color:var(--danger);cursor:pointer;background:0 0;border:none;padding:0;font-size:12px}.pill-add{gap:6px;margin-top:6px;display:flex}.pill-add input{flex:1}#logpanel{background:var(--panel-2);border-top:2px solid var(--brass);font-family:var(--font-mono);font-size:12px}#logpanel .loghead{cursor:pointer;align-items:center;gap:8px;padding:6px 12px;display:flex}#logpanel .loghead b{color:var(--brass);font-family:var(--font-body);font-size:12px}#logpanel .lastline{color:var(--ink-soft);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}#logpanel .loglist{max-height:220px;padding:0 12px 8px;display:none;overflow-y:auto}#logpanel.expanded .loglist{display:block}#logpanel .logentry{border-bottom:1px dotted var(--rule-soft);gap:8px;padding:3px 0;display:flex}#logpanel .logentry .t{color:var(--ink-soft);min-width:52px;font-size:10.5px}#logpanel .logentry .msg{flex:1}#logpanel .logentry .msg b{color:var(--arcane)}#logpanel .logentry.crit .msg b{color:var(--danger)}#logpanel .logentry.hp-up .msg b{color:var(--good)}#logpanel .logentry.hp-down .msg b{color:var(--danger)}#logpanel .chevron{color:var(--brass);transition:transform .15s}#logpanel.expanded .chevron{transform:rotate(180deg)}.modal-back{z-index:50;background:#1e190f80;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.modal-back.open{display:flex}.modal{background:var(--panel);border:1px solid var(--rule);border-radius:12px;width:100%;max-width:520px;max-height:80vh;padding:16px;overflow:auto}.modal.modal-wide{max-width:820px}.modal h3{font-family:var(--font-display);color:var(--brass);margin:0 0 8px}.modal textarea{width:100%;min-height:200px;font-family:var(--font-mono);font-size:11px}.modal-actions{justify-content:flex-end;gap:8px;margin-top:10px;display:flex}.roll-modal{text-align:center;max-width:380px}.roll-modal .rtitle{font-family:var(--font-display);color:var(--ink-soft);margin-bottom:6px;font-size:15px}.roll-modal .rtag{background:var(--panel-2);color:var(--ink-soft);border:1px solid var(--rule);border-radius:20px;margin-bottom:10px;padding:2px 9px;font-size:11px;display:inline-block}.roll-modal .rtotal{font-family:var(--font-mono);color:var(--arcane);font-size:52px;font-weight:700;line-height:1}.roll-modal .rtotal.crit{color:var(--good)}.roll-modal .rtotal.fumble{color:var(--danger)}.roll-modal .rstatus{letter-spacing:.06em;margin-top:4px;font-size:12.5px;font-weight:700}.roll-modal .rstatus.crit{color:var(--good)}.roll-modal .rstatus.fumble{color:var(--danger)}.roll-modal .rbreak{font-family:var(--font-mono);color:var(--ink-soft);border:1px solid var(--rule-soft);background:#fffdf6;border-radius:8px;margin-top:10px;padding:8px;font-size:13px}.flexrow{flex-wrap:wrap;align-items:flex-end;gap:8px;display:flex}.hint{color:var(--ink-soft);margin-top:4px;font-size:11px;font-style:italic}h4.sub{font-family:var(--font-display);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;margin:10px 0 6px;font-size:12.5px}.diamond-row{flex-wrap:wrap;gap:4px;display:flex}.diamond{border:1.5px solid var(--brass);cursor:pointer;background:0 0;width:16px;height:16px;transform:rotate(45deg)}.diamond.on{background:var(--brass)}.insp-row{gap:8px;display:flex}.insp-box{border:1px solid var(--rule);background:#fffdf6;border-radius:8px;flex:1;padding:7px 8px}.insp-box .lbl{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px;font-size:10px}.insp-check{align-items:center;gap:6px;font-size:12.5px;display:flex}.insp-num{align-items:center;gap:6px;display:flex}.insp-num input{text-align:center;width:52px;font-family:var(--font-mono);font-size:15px}
