/* Standalone Démon page /kran-3d/demon (KranDemonPage, kran-demon-viewer.js). */
.kran-demon-page{--kran-paper:#f7f8f5;--kran-ink:#293b3e;--kran-muted:#647779;--kran-line:#dce3df;--kran-accent:#287e8b;color:var(--kran-ink);background:var(--kran-paper);font:14px/1.5 system-ui,sans-serif;max-width:1500px;margin:auto;padding:22px 28px 30px;color-scheme:light}
.kran-demon-page *{box-sizing:border-box}.kran-demon-page [hidden]{display:none!important}
.kran-demon-page button{font:inherit;border:1px solid var(--kran-line);border-radius:5px;background:#fff;color:var(--kran-ink);padding:7px 11px;cursor:pointer;line-height:1.3;min-height:34px}
.kran-demon-page button:hover{border-color:var(--kran-accent);background:#edf5f4}.kran-demon-page button[aria-pressed=true]{background:var(--kran-accent);border-color:var(--kran-accent);color:#fff}
.kran-demon-page :focus-visible{outline:2px solid var(--kran-accent);outline-offset:3px}
.kran-demon-page a{color:var(--kran-muted);text-decoration:none;font-size:12px}.kran-demon-page a:hover{text-decoration:underline}
.kdp-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}
#kran-demon-page .kdp-header h1{margin:4px 0 0;font:400 40px/1.15 Georgia,serif;letter-spacing:2px;color:var(--kran-ink)}
.kdp-header h1 span{display:inline-block;margin-left:20px;font:12px/1.5 system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--kran-muted)}
.kran-demon-page .kdp-edit{border:1px solid var(--kran-accent);border-radius:5px;padding:7px 11px;color:var(--kran-accent)}
.kdp-workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;border:1px solid var(--kran-line);border-radius:8px;overflow:hidden;background:#fff}
.kdp-stage{position:relative;height:clamp(420px,70vh,820px);background:radial-gradient(ellipse 70% 65% at 50% 45%,#f4f6f6 0%,#dfe5e6 55%,#c3cccf 100%);transition:background .4s}
.is-night .kdp-stage{background:radial-gradient(ellipse 70% 65% at 50% 45%,#2c3242 0%,#171b25 60%,#0c0e14 100%)}
.kdp-stage canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.kdp-stage canvas:active{cursor:grabbing}
.kdp-loading{position:absolute;inset:45% 10% auto;margin:0;text-align:center;color:var(--kran-muted)}
.kdp-tools{position:absolute;top:16px;left:16px;display:flex;gap:5px;flex-wrap:wrap}.kdp-tools button{font-size:12px;background:#ffffffd9;backdrop-filter:blur(8px)}
.kdp-stats{position:absolute;left:18px;bottom:10px;margin:0;font-size:11px;font-variant-numeric:tabular-nums;color:#41616a;pointer-events:none}.is-night .kdp-stats{color:#9aa6b4}
.kdp-panel{border-left:1px solid var(--kran-line);background:#fafbf9;padding:18px}
#kran-demon-page .kdp-panel h2{margin:0;font-size:15px;font-weight:600;color:var(--kran-ink)}
.kdp-source,.kdp-note,.kdp-status{font-size:12px;color:var(--kran-muted);margin:9px 0}.kdp-status{min-height:18px;color:var(--kran-accent)}.kdp-note{font-size:11px}
.kdp-control{margin-top:13px}.kdp-control label{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px}
.kdp-control output{font-size:11px;font-variant-numeric:tabular-nums;color:var(--kran-accent)}
.kdp-control input{width:100%;height:20px;margin:5px 0 0;accent-color:var(--kran-accent);cursor:pointer}
.kdp-phase{padding-top:12px;border-top:1px solid var(--kran-line)}
.kdp-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:16px}.kdp-actions button{font-size:12px}
@media(max-width:820px){.kran-demon-page{padding:12px 8px}.kdp-header{align-items:flex-start}#kran-demon-page .kdp-header h1{font-size:32px}.kdp-header h1 span{display:block;margin:5px 0 0;font-size:10px}.kdp-workspace{display:block}.kdp-stage{height:56vh;min-height:330px}.kdp-panel{border-left:0;border-top:1px solid var(--kran-line)}.kdp-tools{top:10px;left:10px}.kdp-tools button{font-size:11px;padding:6px}}
.kdp-control select{width:100%;margin-top:5px;font:inherit;font-size:12px;padding:5px 7px;border:1px solid var(--kran-line);border-radius:5px;background:#fff;color:var(--kran-ink);cursor:pointer}
