:root{--dc-bg:#0b0f14;--dc-bg-canvas-area:#10161d;--dc-panel:#151c25;--dc-panel-alt:#1b2430;--dc-border:#26323f;--dc-border-soft:#1f2933;--dc-cyan:#22d3ee;--dc-cyan-dim:#0e94ac;--dc-cyan-glow:#22d3ee59;--dc-text:#e6edf3;--dc-text-secondary:#9fb0bf;--dc-text-muted:#8c9caa;--dc-success:#34d399;--dc-warning:#fbbf24;--dc-danger:#f87171;--dc-tank:#38bdf8;--dc-healer:#4ade80;--dc-dps:#f87171;--dc-neutral:#94a3b3}*{box-sizing:border-box}html,body{background-color:var(--dc-bg);color:var(--dc-text);margin:0;font-family:Segoe UI,Hiragino Sans,Noto Sans JP,Yu Gothic,sans-serif}#root{min-height:100vh}a{color:var(--dc-cyan)}*{scrollbar-color:var(--dc-cyan-dim) var(--dc-panel);scrollbar-width:thin}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--dc-panel)}::-webkit-scrollbar-thumb{background-color:var(--dc-cyan-dim);border-radius:6px}.header{background:linear-gradient(180deg, var(--dc-panel-alt), var(--dc-panel));border-bottom:1px solid var(--dc-border);flex-wrap:wrap;justify-content:space-between;align-items:center;row-gap:8px;padding:12px 20px;display:flex;box-shadow:0 1px 12px #22d3ee14}.logo{color:var(--dc-text);margin:0;padding:0;font-size:1.1rem;font-weight:600}.logo .accent{color:var(--dc-cyan)}.header-nav{align-items:center;gap:22px;display:flex}.header-nav a{color:var(--dc-text-secondary);font-size:.9rem;text-decoration:none;transition:color .15s}.header-nav a:hover{color:var(--dc-cyan)}.copyright{text-align:right;width:100%;color:var(--dc-text-secondary);opacity:.7;margin:0;font-size:.68rem}body:has(#board-page){overflow:hidden}#board-page{position:static}.board-canvas{z-index:0;background-color:var(--dc-bg-canvas-area);position:fixed;inset:0}.header{z-index:20;position:relative}.ui-layer{z-index:20;pointer-events:none;gap:10px;display:flex;position:fixed}.ui-layer>*{pointer-events:auto}.ui-top{flex-wrap:wrap;align-items:flex-start;max-height:45vh;top:62px;left:12px;right:364px;overflow-y:auto}.ui-right{flex-direction:column;width:340px;top:62px;bottom:12px;right:12px;overflow:hidden auto}body.panels-hidden .header,body.panels-hidden .ui-layer,body.panels-hidden .clip-panel,body.panels-hidden .color-adjust-panel{display:none}.panel-toggle{z-index:60;border:1px solid var(--dc-cyan-dim);height:30px;color:var(--dc-cyan);white-space:nowrap;background-color:#0b0f14eb;border-radius:999px;padding:0 14px;font-size:12px;position:fixed;bottom:12px;left:12px}.panel-toggle:hover{background-color:var(--dc-cyan-dim);color:#04141a}@media (width<=1100px){.ui-right{width:280px}.ui-top{right:304px}}@media (width<=820px){:root{--sheet-height:40vh}.ui-right{width:auto;height:var(--sheet-height);flex-flow:wrap;align-items:flex-start;inset:auto 12px 8px}.ui-top{max-height:calc(100vh - var(--sheet-height) - 62px - 52px);right:12px}.panel-toggle{left:auto;right:12px;bottom:calc(var(--sheet-height) + 14px)}}.toolbar{background-color:var(--dc-panel);border:1px solid var(--dc-border);border-radius:10px;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 14px;display:flex}.toolbar input[type=text],.toolbar input:not([type]){height:30px}input,select,textarea{background-color:var(--dc-panel-alt);border:1px solid var(--dc-border);color:var(--dc-text);border-radius:6px;height:30px;padding:0 10px;font-size:13px}input::placeholder{color:var(--dc-text-muted)}input:focus,select:focus,textarea:focus{border-color:var(--dc-cyan);box-shadow:0 0 0 3px var(--dc-cyan-glow);outline:none}input[type=color]{cursor:pointer;width:30px;height:30px;padding:2px}input[type=number]{width:70px}.room-status{color:var(--dc-text-secondary);margin-left:auto;font-size:12px}button{cursor:pointer;font-family:inherit}.btn-pill{border:1px solid var(--dc-border);background-color:var(--dc-panel-alt);height:30px;color:var(--dc-text);white-space:nowrap;cursor:pointer;border-radius:999px;justify-content:center;align-items:center;padding:0 14px;font-size:13px;transition:background-color .15s,color .15s,border-color .15s;display:inline-flex}.btn-pill:hover{border-color:var(--dc-cyan);color:var(--dc-cyan)}.btn-pill.btn-primary{background-color:var(--dc-cyan-dim);border-color:var(--dc-cyan);color:#04141a}.btn-pill.btn-primary:hover{background-color:var(--dc-cyan);color:#04141a}.btn-pill.btn-cyan{border-color:var(--dc-cyan-dim);color:var(--dc-cyan);background-color:#0000}.btn-pill.btn-cyan:hover{background-color:var(--dc-cyan-dim);color:#04141a}.btn-pill.btn-danger{border-color:var(--dc-danger);color:var(--dc-danger);background-color:#0000}.btn-pill.btn-danger:hover{background-color:var(--dc-danger);color:#1a0505}.modal-backdrop{z-index:1000;background:#0000008c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--dc-panel,#12202b);border:1px solid var(--dc-danger);border-radius:10px;width:calc(100% - 48px);max-width:420px;padding:20px 22px;box-shadow:0 12px 40px #00000080}.modal-title{color:var(--dc-danger);margin:0 0 10px;font-size:1.05rem}.modal-message{margin:0 0 18px;font-size:.9rem;line-height:1.6}.modal-actions{justify-content:flex-end;gap:10px;display:flex}.floor-selector{background-color:var(--dc-panel);border:1px solid var(--dc-border);border-radius:10px;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;display:flex}.floor-selector select{max-width:160px}.floor-current{color:var(--dc-cyan);flex-basis:100%;font-size:12px}.mode-bar{border:1px solid var(--dc-border);background-color:#0b0f14d1;border-radius:8px;align-self:flex-start;align-items:center;gap:8px;padding:6px 8px;display:flex;box-shadow:0 4px 14px #00000080}.mode-bar button{box-sizing:border-box;white-space:nowrap;border:1px solid var(--dc-border);width:34px;height:30px;color:var(--dc-text-secondary);background-color:#0000;border-radius:6px;justify-content:center;align-items:center;padding:0 6px;font-size:11px;line-height:1;display:inline-flex;overflow:hidden}.mode-bar .material-icons{font-size:18px;line-height:1}.mode-bar button.clear-lines{gap:4px;width:auto;padding:0 10px}.mode-bar button.clear-lines span{font-size:12px}.mode-bar button:hover{border-color:var(--dc-cyan-dim);color:var(--dc-cyan)}.mode-bar button.active{background-color:var(--dc-cyan-dim);border-color:var(--dc-cyan);color:#04141a}.gimmick-panel{background-color:var(--dc-panel);border:1px solid var(--dc-border);border-left:3px solid var(--dc-success);border-radius:10px;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px;display:flex}.gimmick-panel-label{letter-spacing:.04em;text-transform:uppercase;color:var(--dc-text-secondary);white-space:nowrap;margin-right:2px;font-size:12px;font-weight:700}.gimmick-panel-label:not(:first-child){margin-left:10px}.icon-palette{background-color:var(--dc-panel);border:1px solid var(--dc-border);border-radius:10px;flex-direction:column;padding:10px;display:flex}.icon-tabs{gap:4px;margin-bottom:8px;display:flex}.icon-tabs button{border:1px solid var(--dc-border);background-color:var(--dc-panel-alt);height:34px;color:var(--dc-text-secondary);border-radius:6px;flex:1;font-size:13px;font-weight:600}.icon-tabs button:hover{color:var(--dc-cyan);border-color:var(--dc-cyan-dim)}.icon-tabs button.active{background-color:var(--dc-cyan-dim);border-color:var(--dc-cyan);color:#04141a}.icon-grid{border:1px solid var(--dc-border);background-color:var(--dc-panel-alt);border-radius:8px;flex-wrap:wrap;align-content:flex-start;gap:8px;max-height:420px;padding:10px;display:flex;overflow-y:auto}.icon-grid img{cursor:pointer;object-fit:contain;background-color:#ffffff0a;border-radius:6px;transition:filter .15s,transform .1s}.icon-grid img:hover{filter:drop-shadow(0 0 4px var(--dc-cyan));transform:translateY(-1px)}.status-search{background-color:var(--dc-panel);border:1px solid var(--dc-border);border-radius:10px;flex-direction:column;gap:8px;padding:10px 12px;display:flex}.status-search form{gap:6px;display:flex}.status-search form input{flex:1}.status-results{flex-wrap:wrap;gap:6px;display:flex}.status-results img{cursor:pointer;background-color:var(--dc-panel-alt);border-radius:4px}.status-results img:hover{filter:drop-shadow(0 0 3px var(--dc-cyan))}.clip-panel,.color-adjust-panel{z-index:40;border:1px solid var(--dc-border);min-width:220px;box-shadow:0 4px 20px #0000008c, 0 0 0 1px var(--dc-cyan-glow);color:var(--dc-text);background-color:#151c25f7;border-radius:10px;flex-direction:column;gap:10px;padding:14px 16px;display:flex;position:fixed;bottom:20px;right:20px}.color-adjust-panel{bottom:20px;right:260px}.clip-panel label,.color-adjust-panel label{color:var(--dc-text-secondary);align-items:center;gap:8px;font-size:12px;display:flex}.clip-panel input[type=number],.color-adjust-panel input[type=number]{width:60px;margin-left:auto}.color-adjust-panel input[type=range]{accent-color:var(--dc-cyan);flex:1}.color-adjust-panel button{background-color:var(--dc-panel-alt);border:1px solid var(--dc-cyan-dim);color:var(--dc-cyan);border-radius:999px;align-self:flex-start;padding:4px 12px;font-size:12px}.color-adjust-panel button:hover{background-color:var(--dc-cyan-dim);color:#04141a}.toast-container{z-index:9999;pointer-events:none;flex-direction:column;align-items:center;display:flex;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%)}.toast{background-color:var(--dc-panel);color:var(--dc-text);border:1px solid var(--dc-border);border-radius:8px;margin-bottom:10px;padding:12px 20px;animation:.3s forwards toast-in;box-shadow:0 4px 8px #0000004d}@keyframes toast-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.dice,.playstation{width:24px;height:24px}.guide-page{line-height:1.75}.guide-page header.hero{background:linear-gradient(180deg, var(--dc-panel-alt), var(--dc-panel));border-bottom:1px solid var(--dc-border);text-align:center;padding:48px 20px 40px}.guide-page header.hero .badge{border:1px solid var(--dc-cyan-dim);color:var(--dc-cyan);letter-spacing:.08em;border-radius:999px;margin-bottom:16px;padding:4px 14px;font-size:.8rem;display:inline-block}.guide-page header.hero h1{color:var(--dc-text);margin:0 0 10px;font-size:clamp(1.6rem,4vw,2.4rem)}.guide-page header.hero p.lead{color:var(--dc-text-secondary);max-width:640px;margin:0 auto;font-size:1.05rem}.guide-page header.hero .cta{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:24px;display:flex}.guide-page .btn{border:1px solid #0000;border-radius:8px;padding:10px 22px;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-block}.guide-page .btn-primary{background-color:var(--dc-cyan-dim);color:#04141a}.guide-page .btn-primary:hover{background-color:var(--dc-cyan)}.guide-page .btn-ghost{border-color:var(--dc-border);color:var(--dc-text)}.guide-page .btn-ghost:hover{border-color:var(--dc-cyan);color:var(--dc-cyan)}.guide-page nav.toc{background:var(--dc-panel);border:1px solid var(--dc-border);z-index:2;border-radius:12px;flex-wrap:wrap;justify-content:center;gap:8px 18px;max-width:960px;margin:-20px auto 0;padding:16px 20px;font-size:.9rem;display:flex;position:relative}.guide-page nav.toc a{color:var(--dc-text-secondary);text-decoration:none}.guide-page nav.toc a:hover{color:var(--dc-cyan)}.guide-page .guide-body{max-width:960px;margin:48px auto;padding:0 20px}.guide-page section{margin-bottom:56px;scroll-margin-top:24px}.guide-page section h2{color:var(--dc-cyan);border-bottom:1px solid var(--dc-border);align-items:center;gap:10px;margin-bottom:20px;padding-bottom:10px;font-size:1.4rem;display:flex}.guide-page section h2 .num{background:var(--dc-panel-alt);border:1px solid var(--dc-cyan-dim);width:30px;height:30px;color:var(--dc-cyan);border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:.9rem;display:inline-flex}.guide-page section h3{color:var(--dc-text);margin:24px 0 8px;font-size:1.05rem}.guide-page p{color:var(--dc-text-secondary);margin:0 0 12px}.guide-page .grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;display:grid}.guide-page .feature{background:var(--dc-panel);border:1px solid var(--dc-border);border-radius:10px;padding:16px 18px}.guide-page .feature .ftitle{color:var(--dc-cyan);align-items:center;gap:8px;margin-bottom:6px;font-weight:700;display:flex}.guide-page .feature p{margin:0;font-size:.92rem}.guide-page ol.steps{counter-reset:step;padding-left:0;list-style:none}.guide-page ol.steps li{counter-increment:step;margin-bottom:6px;padding:6px 0 6px 44px;position:relative}.guide-page ol.steps li:before{content:counter(step);background:var(--dc-panel-alt);border:1px solid var(--dc-cyan-dim);width:28px;height:28px;color:var(--dc-cyan);border-radius:50%;justify-content:center;align-items:center;font-size:.85rem;font-weight:700;display:flex;position:absolute;top:4px;left:0}.guide-page table{border-collapse:collapse;background:var(--dc-panel);border:1px solid var(--dc-border);border-radius:10px;width:100%;font-size:.92rem;overflow:hidden}.guide-page table th,.guide-page table td{border-bottom:1px solid var(--dc-border-soft);text-align:left;vertical-align:top;padding:10px 14px}.guide-page table th{background:var(--dc-panel-alt);color:var(--dc-cyan);width:30%;font-weight:600}.guide-page table tr:last-child td{border-bottom:none}.guide-page .tag{border:1px solid var(--dc-border);color:var(--dc-text-muted);border-radius:999px;margin-left:6px;padding:2px 8px;font-size:.72rem;display:inline-block}.guide-page .tag.new{border-color:var(--dc-success);color:var(--dc-success)}.guide-page .tag.wip{border-color:var(--dc-warning);color:var(--dc-warning)}.guide-page .note{border-left:3px solid var(--dc-cyan-dim);background:var(--dc-panel-alt);color:var(--dc-text-secondary);border-radius:0 8px 8px 0;padding:12px 16px;font-size:.9rem}.guide-page .note.warn{border-left-color:var(--dc-warning)}.guide-page .note strong{color:var(--dc-text)}.guide-page kbd{background:var(--dc-panel-alt);border:1px solid var(--dc-border);color:var(--dc-text);border-bottom-width:2px;border-radius:5px;padding:1px 7px;font-size:.85em}.guide-page code{background:var(--dc-panel-alt);border:1px solid var(--dc-border);color:var(--dc-cyan);border-radius:5px;padding:1px 6px;font-size:.88em}.guide-page .icon-row{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.guide-page .chip{background:var(--dc-panel-alt);border:1px solid var(--dc-border);color:var(--dc-text-secondary);border-radius:6px;padding:4px 10px;font-size:.82rem}.guide-page footer{border-top:1px solid var(--dc-border);text-align:center;color:var(--dc-text-muted);padding:28px 20px 40px;font-size:.85rem}.guide-page .back-top{background:var(--dc-panel);border:1px solid var(--dc-cyan-dim);color:var(--dc-cyan);border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;font-size:1.1rem;text-decoration:none;display:flex;position:fixed;bottom:20px;right:20px;box-shadow:0 4px 14px #0006}@media (width<=600px){.guide-page .guide-body{margin:32px auto}.guide-page section h2{font-size:1.2rem}}