:root{--navy-deep: #060c20;--navy-0: #0a142e;--navy-1: #14224a;--navy-2: #0c1838;--edge: #6f96d8;--edge-soft: #2f4a86;--cream: #edefe0;--gold: #f1d18a;--cyan: #7fd9ff;--dim: #8298c4;--bad: #ff9a8c;--radius: 5px;--window: linear-gradient(180deg, rgba(34, 60, 120, .92), rgba(8, 18, 44, .96))}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:Jura,system-ui,sans-serif;color:var(--cream);background:radial-gradient(1200px 700px at 70% -10%,rgba(40,78,150,.35),transparent 60%),radial-gradient(900px 600px at 0% 110%,rgba(20,40,90,.5),transparent 55%),var(--navy-deep);-webkit-font-smoothing:antialiased}.app{display:flex;flex-direction:column;height:100%;padding:14px;gap:12px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:baseline;gap:10px}.brand-mark{color:var(--gold);font-size:20px;transform:translateY(2px)}.brand-name{font-weight:700;font-size:22px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream);text-shadow:0 0 14px rgba(127,217,255,.25)}.brand-sub{color:var(--dim);font-size:12px;letter-spacing:.08em}.actions{display:flex;align-items:center;gap:10px}.counter{color:var(--dim);font-size:12px;letter-spacing:.05em}.char-select{display:flex;align-items:center;gap:8px}.char-select-label{color:var(--dim);font-size:11px;letter-spacing:.12em;text-transform:uppercase}.char-select select{background:#0c1838d9;border:1px solid var(--edge-soft);border-radius:5px;color:var(--cream);font-family:inherit;font-size:13px;padding:6px 10px;cursor:pointer;min-width:160px}.char-select select:hover{border-color:var(--edge)}.char-select select:focus{outline:none;border-color:var(--cyan)}.char-rename{display:flex;align-items:center;gap:6px}.char-folder{color:var(--gold);font-size:13px;letter-spacing:.04em}.char-rename input{background:#0c1838d9;border:1px solid var(--edge-soft);border-radius:5px;color:var(--cream);font-family:inherit;font-size:13px;padding:6px 10px;width:130px}.char-rename input:hover{border-color:var(--edge)}.char-rename input:focus{outline:none;border-color:var(--cyan)}.char-rename input::placeholder{color:var(--dim)}.btn{font-family:inherit;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--cream);background:var(--window);border:1px solid var(--edge-soft);border-radius:var(--radius);padding:9px 16px;cursor:pointer;box-shadow:inset 0 1px #8cb4f02e;transition:border-color .12s,box-shadow .12s,transform .05s}.btn:hover{border-color:var(--edge);box-shadow:inset 0 1px #a0c8ff4d,0 0 12px #6f96d840}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:default}.btn.primary{border-color:var(--cyan);color:#eaffff;box-shadow:inset 0 1px #a0e6ff66,0 0 14px #7fd9ff4d}.btn.ghost{background:#0c183899}.btn.tiny{padding:4px 10px;font-size:11px}.panel{background:var(--window);border:1px solid var(--edge-soft);border-radius:var(--radius);box-shadow:inset 0 0 0 1px #78a0e61f,inset 0 1px #96befa38,0 8px 26px #00000080}.panel-head{padding:10px 14px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);border-bottom:1px solid var(--edge-soft)}.layout{display:grid;grid-template-columns:240px 1fr;gap:12px;flex:1;min-height:0}.sidebar{display:flex;flex-direction:column;min-height:0}.book-list{flex:1;overflow-y:auto;padding:6px;display:flex;flex-direction:column;gap:2px}.book-row{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:4px;color:var(--cream);font-family:inherit;font-size:13px;padding:7px 8px;cursor:pointer}.book-row:hover{background:#7fd9ff12}.book-row.active{background:linear-gradient(180deg,#7fd9ff2e,#7fd9ff0f);border-color:var(--cyan)}.book-idx{width:22px;color:var(--dim);font-size:11px;text-align:right}.book-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.book-dot{font-size:10px;color:var(--navy-deep);background:var(--gold);border-radius:999px;padding:1px 6px;font-weight:700}.main{display:flex;flex-direction:column;min-height:0;padding:14px;gap:14px;overflow-y:auto}.book-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.book-title-input{font-family:inherit;font-size:18px;letter-spacing:.06em;color:var(--gold);background:#060c2080;border:1px solid var(--edge-soft);border-radius:4px;padding:8px 12px;min-width:200px}.book-title-input:focus{outline:none;border-color:var(--cyan)}.set-tabs{display:flex;gap:4px;margin-left:auto}.set-tab{width:30px;height:30px;font-family:inherit;font-size:13px;color:var(--dim);background:#060c2080;border:1px solid var(--edge-soft);border-radius:4px;cursor:pointer}.set-tab.has{color:var(--cream)}.set-tab:hover{border-color:var(--edge)}.set-tab.active{color:var(--navy-deep);background:var(--cyan);border-color:var(--cyan);font-weight:700}.palette{border:1px solid var(--edge-soft);border-radius:var(--radius);background:#0409188c;box-shadow:inset 0 0 24px #0000008c;padding:14px;display:flex;flex-direction:column;gap:10px}.palette-row{display:flex;align-items:center;gap:12px}.row-key{width:40px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}.cells{display:grid;grid-template-columns:repeat(10,1fr);gap:6px;flex:1}.cell{position:relative;aspect-ratio:1 / 1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-family:inherit;color:var(--dim);background:linear-gradient(180deg,#1a2e5c99,#081028b3);border:1px solid var(--edge-soft);border-radius:4px;cursor:pointer;padding:4px;overflow:hidden;transition:border-color .1s,box-shadow .1s}.cell:hover{border-color:var(--edge)}.cell-num{position:absolute;top:3px;left:5px;font-size:10px;color:#8ca5cd99}.cell-title{font-size:13px;line-height:1.1;text-align:center;word-break:break-word;color:var(--cream)}.cell.filled{color:var(--cream)}.cell.filled .cell-title{color:var(--gold)}.cell.sel{border-color:var(--cyan);box-shadow:0 0 0 1px var(--cyan),0 0 16px #7fd9ff73;background:linear-gradient(180deg,#3860a0b3,#102046cc)}.editor{border:1px solid var(--edge-soft);border-radius:var(--radius);background:#060c2073;padding:14px;display:flex;flex-direction:column;gap:8px}.editor-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.editor-slot{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}.field{display:flex;align-items:center;gap:12px}.field>span{width:48px;text-align:right;font-size:12px;color:var(--dim)}.field input{flex:1;font-family:inherit;font-size:14px;color:var(--cream);background:#040918b3;border:1px solid var(--edge-soft);border-radius:4px;padding:9px 12px}.field input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 10px #7fd9ff33}.field input::placeholder{color:#8298c480}.field.mono input{font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:13px}.line-input{position:relative;flex:1}.line-input input{width:100%;box-sizing:border-box}.ac-menu{position:absolute;z-index:30;top:calc(100% + 4px);left:0;right:0;max-height:244px;overflow-y:auto;margin:0;padding:4px;list-style:none;background:linear-gradient(180deg,#14224afa,#081028fa);border:1px solid var(--edge);border-radius:6px;box-shadow:0 10px 28px #0000008c}.ac-item{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:6px 10px;border-radius:4px;cursor:pointer}.ac-item.active{background:linear-gradient(180deg,#7fd9ff38,#7fd9ff14)}.ac-label{color:var(--cream);font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:13px;white-space:nowrap}.ac-detail{color:var(--dim);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#0206129e}.modal{width:min(460px,92vw);max-height:86vh;display:flex;flex-direction:column;background:var(--window);border:1px solid var(--edge);border-radius:var(--radius);box-shadow:0 18px 50px #0009}.modal-head{padding:12px 16px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--cream);border-bottom:1px solid var(--edge-soft)}.modal-body{padding:12px;overflow-y:auto}.modal-foot{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:12px 16px;border-top:1px solid var(--edge-soft)}.modal-warn{margin-right:auto;color:var(--gold);font-size:12px}.modal-text{margin:4px 2px;font-size:14px;line-height:1.5;color:var(--cream)}.modal-emph{color:var(--gold);font-weight:600}.template-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.template-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:10px;border-radius:6px;background:#060c2080;border:1px solid var(--edge-soft);color:var(--cream);font-family:inherit;cursor:pointer}.template-item:hover{border-color:var(--edge)}.template-item.active{border-color:var(--cyan);background:linear-gradient(180deg,#7fd9ff29,#7fd9ff0d)}.template-icon{width:38px;height:38px;border-radius:6px;flex-shrink:0}.template-text{display:flex;flex-direction:column;gap:2px;min-width:0}.template-name{font-size:14px;color:var(--gold);letter-spacing:.03em}.template-desc{font-size:12px;color:var(--dim)}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:var(--edge-soft);border-radius:6px}::-webkit-scrollbar-track{background:transparent}@media (max-width: 820px){.layout{grid-template-columns:1fr}.sidebar{max-height:180px}.cells{gap:4px}.cell-title{font-size:11px}}@media (prefers-reduced-motion: reduce){*{transition:none!important}}