:root{--xl-green:#217346;--hdr:#f3f3f3;--hdr-line:#d4d4d4;--hdr-ink:#444;--grid:#e1e1e1;--ink:#1f1f1f;--muted:#6b6b6b;--bar:#2f4a7a}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic UI","Meiryo",sans-serif;background:#fff;color:var(--ink);
display:flex;flex-direction:column;overflow:hidden;-webkit-text-size-adjust:100%}
header{background:var(--bar);color:#fff;padding:8px 12px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;flex:none}
header h1{margin:0;font-size:15px;font-weight:600}
header .meta{font-size:11px;opacity:.88}
header a{color:#fff}
#status{font-size:11px;padding:1px 8px;border-radius:10px;background:rgba(255,255,255,.18)}
#status.err{background:#b3261e}
#status.wait{background:#b07400}
#bar{display:flex;align-items:center;gap:6px;padding:4px 8px;border-bottom:1px solid var(--hdr-line);background:#fafafa;flex:none}
#namebox{width:96px;flex:none;font:12px/1 Consolas,monospace;padding:5px 6px;border:1px solid #c8c8c8;background:#fff;text-align:center}
#fx{font:italic 13px Georgia,serif;color:var(--muted);flex:none}
#fbar{flex:1;min-width:0;font:13px/1.2 Consolas,"MS Gothic",monospace;padding:5px 6px;border:1px solid #c8c8c8;background:#fff}
#fbar[readonly]{background:#f6f6f6;color:#555}
#bar button,#tools button{font:12px system-ui,sans-serif;padding:4px 8px;border:1px solid #c8c8c8;background:#fff;border-radius:3px;cursor:pointer;flex:none}
#bar button:hover{background:#eef5f0}
#zoomv{font-size:11px;color:var(--muted);width:36px;text-align:center;flex:none}
#banner{display:none;padding:6px 12px;font-size:12px;background:#fff4ce;border-bottom:1px solid #e8d48a;flex:none}
#banner.show{display:block}
#banner button{font-size:12px;margin-left:8px}
#view{position:relative;flex:1;min-height:0;overflow:hidden;background:#fff;user-select:none;-webkit-user-select:none}
.pane{position:absolute;overflow:hidden}
.c{position:absolute;overflow:hidden}
.t{position:absolute;white-space:pre;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;pointer-events:none;line-height:1.15}
.t.w{white-space:pre-wrap;word-break:break-all}
.t.vt{justify-content:flex-start}.t.vc{justify-content:center}
.t span{display:block;overflow:hidden;text-overflow:clip}
.hc,.hr{position:absolute;background:var(--hdr);color:var(--hdr-ink);font:11px/1 system-ui,"Segoe UI",sans-serif;display:flex;align-items:center;justify-content:center;
border-right:1px solid var(--hdr-line);border-bottom:1px solid var(--hdr-line)}
.hc.on,.hr.on{background:#d3e3d8;color:#0b5132;font-weight:600;border-bottom-color:var(--xl-green)}
.hr.on{border-bottom-color:var(--hdr-line);border-right-color:var(--xl-green)}
#corner{position:absolute;left:0;top:0;background:var(--hdr);border-right:1px solid var(--hdr-line);border-bottom:1px solid var(--hdr-line)}
#scroller{position:absolute;inset:0;overflow:auto;z-index:5;background:transparent;-webkit-overflow-scrolling:touch}
#spacer{position:absolute;left:0;top:0;width:1px;height:1px}
.selbox{position:absolute;border:2px solid var(--xl-green);pointer-events:none;z-index:3}
.selfill{position:absolute;background:rgba(33,115,70,.10);pointer-events:none;z-index:2}
.cm{position:absolute;width:0;height:0;border-top:6px solid #d00;border-left:6px solid transparent;pointer-events:none}
.pd{position:absolute;width:0;height:0;border-bottom:7px solid #1a73e8;border-right:7px solid transparent;pointer-events:none}
.fz-h{position:absolute;height:1px;background:#8a8a8a;z-index:4;pointer-events:none}
.fz-v{position:absolute;width:1px;background:#8a8a8a;z-index:4;pointer-events:none}
.chart{position:absolute;background:#fff;border:1px solid #d9d9d9;pointer-events:none}
#editor{position:absolute;z-index:8;margin:0;border:2px solid var(--xl-green);padding:0 3px;outline:none;background:#fff;color:#000;font-family:Calibri,"Yu Gothic",sans-serif;opacity:0;pointer-events:none;resize:none;overflow:hidden;white-space:pre}
#editor.on{opacity:1;pointer-events:auto;box-shadow:0 2px 6px rgba(0,0,0,.2)}
#tabs{display:flex;align-items:stretch;gap:0;background:#e9e9e9;border-top:1px solid #c8c8c8;overflow-x:auto;flex:none;scrollbar-width:thin}
#tabs button{flex:none;font:12px system-ui,"Segoe UI","Yu Gothic UI",sans-serif;padding:6px 14px 5px;border:0;border-right:1px solid #cfcfcf;background:#e9e9e9;color:#333;cursor:pointer;position:relative;white-space:nowrap}
#tabs button.on{background:#fff;color:var(--xl-green);font-weight:600;box-shadow:inset 0 -3px 0 var(--xl-green)}
#tabs button i{position:absolute;left:0;right:0;bottom:0;height:4px}
#tabs button.on i{bottom:3px}
#tip{position:fixed;z-index:30;max-width:320px;background:#fffbe6;border:1px solid #c9b458;padding:6px 8px;font-size:12px;white-space:pre-wrap;box-shadow:0 2px 8px rgba(0,0,0,.18);display:none;pointer-events:none}
#toast{position:fixed;left:50%;bottom:52px;transform:translateX(-50%);z-index:40;background:#323232;color:#fff;padding:8px 14px;border-radius:6px;font-size:13px;display:none;max-width:90vw}
#lock{position:fixed;inset:0;z-index:50;background:#f4f5f7;display:flex;align-items:center;justify-content:center;padding:16px}
#lock form{background:#fff;border:1px solid #d6d6d6;border-radius:10px;padding:20px;width:100%;max-width:380px;box-shadow:0 4px 18px rgba(0,0,0,.08)}
#lock h2{margin:0 0 6px;font-size:16px}
#lock p{margin:0 0 12px;font-size:12px;color:var(--muted);line-height:1.6}
#lock input{width:100%;font-size:16px;padding:9px 10px;border:1px solid #bbb;border-radius:6px}
#lock button{margin-top:10px;width:100%;font-size:15px;padding:9px;border:0;border-radius:6px;background:var(--xl-green);color:#fff;cursor:pointer}
#lock .err{color:#b3261e;font-size:12px;min-height:16px;margin-top:6px}
#lock[hidden]{display:none}
#conf{display:none;padding:6px 12px;font-size:12px;background:#fde7e9;border-bottom:1px solid #f1b4ba;flex:none;max-height:30vh;overflow:auto}
#conf.show{display:block}
#conf li{margin:2px 0}
#conf button{font-size:11px;margin-left:6px}
@media (max-width:600px){header .meta{display:none}#bar{flex-wrap:wrap}#fbar{order:9;flex-basis:100%}}
#menu{position:fixed;z-index:60;background:#fff;border:1px solid #c8c8c8;box-shadow:0 4px 14px rgba(0,0,0,.18);border-radius:4px;padding:4px 0;min-width:170px}
#menu[hidden]{display:none}
#menu button{display:block;width:100%;text-align:left;font:13px system-ui,sans-serif;padding:7px 14px;border:0;background:none;cursor:pointer}
#menu button:hover{background:#eef5f0}
#fmtp{position:fixed;z-index:60;background:#fff;border:1px solid #c8c8c8;box-shadow:0 4px 14px rgba(0,0,0,.18);border-radius:4px;padding:8px 10px;width:380px;max-width:calc(100vw - 8px);font:12px system-ui,sans-serif}
#fmtp[hidden]{display:none}
#fmtp .row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:4px 0}
#fmtp .sep{width:8px}
#fmtp button{font:12px system-ui,sans-serif;padding:3px 8px;border:1px solid #c8c8c8;background:#fff;border-radius:3px;cursor:pointer;min-width:28px}
#fmtp button.on{background:#dcebe0;border-color:#8ab293}
#fmtp input[type=number]{width:64px}
#fmtp select{font:12px system-ui,sans-serif}
#fmtp .note{color:#777;font-size:11px;margin-top:4px}
#rsz{position:absolute;z-index:30;pointer-events:none;background:#2e7d4f}
#rsz[hidden]{display:none}
#rsz.v{top:0;bottom:0;width:1px}
#rsz.h{left:0;right:0;height:1px}
#unlock.on{background:#fde9c9;border-color:#e0a33b;color:#7a4b00}
#viewst{background:#e8f1ff;border-color:#8fb3e6;color:#1a4b8c}
.hc small{font-size:9px;margin-left:2px;color:#1a4b8c}