:root,:host{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#202a51;background:#f3f4fa;font-size:16px;color-scheme:light}
:host{display:block}.viewer.embedded{margin:0;height:calc(100dvh - 155px);min-height:520px}.viewer.embedded.focused{height:100dvh;min-height:0}
*{box-sizing:border-box}body{margin:0}button,input,a{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{min-width:44px;min-height:44px;border:1px solid #cdd2e3;background:#fff;border-radius:10px;color:#26345e;cursor:pointer;padding:8px 12px}button:hover{background:#eeebfc;border-color:#8070d3}button:disabled{opacity:.42;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,.stage:focus-visible{outline:3px solid #6552d9;outline-offset:3px}[hidden]{display:none!important}
.skip{position:fixed;left:12px;top:-80px;z-index:20;background:white;padding:12px}.skip:focus{top:12px}.page-head{height:82px;padding:14px 24px;display:flex;align-items:center;gap:24px}.page-head a{color:#5543b1;text-decoration:none;font-size:14px}.page-head h1{font-size:21px;margin:0}.page-head>span{margin-left:auto;color:#616b83;font-size:14px}
.viewer{display:grid;grid-template-columns:220px minmax(0,1fr);height:calc(100dvh - 98px);min-height:420px;margin:0 18px 16px;gap:14px}aside{padding:18px 12px;background:#fff;border:1px solid #e1e4ee;border-radius:16px;display:flex;flex-direction:column;min-height:0}aside label{font-weight:650;font-size:14px;margin-bottom:12px}#total{color:#72658f}input{width:100%;min-height:44px;border:1px solid #cdd2e3;border-radius:9px;padding:10px;font-size:14px}#list{overflow:auto;margin-top:12px;scrollbar-width:thin}#list button{display:block;text-align:left;border-color:transparent;width:100%;font-size:14px;margin:2px 0}#list button[aria-current=true]{background:#ece8fc;color:#4935ac;border-color:#d5cdf2;font-weight:700}#empty{font-size:14px;color:#626a80}
.image-panel{display:flex;flex-direction:column;min-width:0;min-height:0;border:1px solid #dce0ed;border-radius:16px;overflow:hidden;background:#fff}.toolbar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid #e4e6ef}.current{flex:1;min-width:140px}.current h2{font-size:18px;margin:0 0 3px}.current span{font-size:13px;color:#646e87}.controls{display:flex;align-items:center;gap:6px}.focus-button{background:#6552d9;color:white;border-color:#6552d9}.focus-button:hover{background:#5140bb;color:white}#menu{display:none}.stage{flex:1;min-height:0;overflow:auto;background:#e9ebf3;overscroll-behavior:contain}.canvas{display:grid;place-items:center;min-width:100%;min-height:100%;width:max-content}#sheet{display:block;max-width:none;height:auto;box-shadow:0 5px 20px #1e285518}footer{display:flex;align-items:center;gap:12px;padding:8px 16px;min-height:42px;font-size:13px;color:#59647e}footer p{margin:0}footer>span{margin-left:auto}.viewer.focused{position:fixed;inset:0;z-index:100;margin:0;width:100%;height:100dvh;grid-template-columns:minmax(0,1fr);background:#e9ebf3;min-height:0}.viewer.focused aside{display:none}.viewer.focused .image-panel{border-radius:0;border:0}.viewer:fullscreen{width:100%;height:100%;margin:0}.viewer.focused #menu{display:none}
@media(max-width:1000px){.viewer{grid-template-columns:185px minmax(0,1fr);gap:8px;margin-inline:10px}.toolbar{gap:8px}.controls{flex-wrap:wrap}.page-head>span,footer>span{display:none}}
@media(max-width:650px){.page-head{height:86px;padding:12px 14px;display:block}.page-head h1{font-size:19px;margin-top:7px}.viewer{height:calc(100dvh - 98px);min-height:360px;grid-template-columns:minmax(0,1fr);position:relative}.toolbar{padding:10px;gap:8px}.current{min-width:100px}.current h2{font-size:16px}.controls{width:100%;justify-content:space-between;gap:4px}.controls button{padding:7px 9px;font-size:14px}.focus-button{margin-left:auto}#menu{display:block;font-size:14px}.viewer aside{display:none;position:absolute;top:65px;bottom:4px;left:4px;width:min(280px,85%);z-index:5;box-shadow:4px 8px 30px #202a5130}.viewer.menu-open aside{display:flex}footer{padding:8px 10px}.viewer.focused{position:fixed;height:100dvh}.viewer.focused .controls{width:auto;flex:1}.viewer.focused .current{width:100%}}