:root{--accent:#2457d6;--line:#d0d5dd;--muted:#667085;--bg:#eef2f6}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:-apple-system,BlinkMacSystemFont,"Microsoft JhengHei","PingFang TC",sans-serif;background:var(--bg);color:#101828}
button,input,select{font:inherit}
.shell{height:100%;display:grid;grid-template-columns:300px 1fr}
.nav{background:#fff;border-right:1px solid var(--line);padding:18px;overflow:auto}
.nav header{display:flex;gap:10px;align-items:center;margin-bottom:18px}
.logo{width:42px;height:42px;border-radius:11px;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:700}
h1{margin:0;font-size:18px}.version{font-size:11px;color:var(--muted)}
.date-label,.export-box label{display:block;font-size:11px;color:var(--muted);margin-bottom:5px}
#journalDate,#quality{width:100%;border:1px solid var(--line);border-radius:8px;padding:9px;background:#fff}
#moduleNav{display:grid;gap:7px;margin-top:18px}
#moduleNav button{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:9px;padding:10px;background:#fff;text-align:left;color:#344054;cursor:pointer}
#moduleNav button b{width:23px;height:23px;border-radius:50%;background:#f2f4f7;display:grid;place-items:center;font-size:11px}
#moduleNav button.active{border-color:var(--accent);color:#1d4ed8;box-shadow:0 0 0 2px #dbeafe}
#moduleNav button.active b{background:var(--accent);color:#fff}
.export-box{border-top:1px solid #eaecf0;margin-top:18px;padding-top:18px}
.export-button{width:100%;border:0;border-radius:9px;background:var(--accent);color:#fff;padding:11px;margin-top:9px;cursor:pointer}
#exportStatus{font-size:11px;color:var(--muted);text-align:center;line-height:1.5;margin-top:8px;min-height:32px}
.content{min-width:0;height:100%;display:grid;grid-template-rows:46px 1fr}
.topbar{background:#fff;border-bottom:1px solid var(--line);padding:0 16px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted)}
#currentTitle{font-size:14px;color:#101828;font-weight:600}
.frames{position:relative;min-height:0}
.module-frame{position:absolute;inset:0;width:100%;height:100%;border:0;display:none;background:#fff}
.module-frame.active{display:block}
.busy{pointer-events:none;opacity:.7}
@media(max-width:850px){.shell{grid-template-columns:1fr}.nav{position:relative;border-right:0;border-bottom:1px solid var(--line)}.content{height:900px}}
.roc-date{font-size:11px;color:var(--muted);margin-top:5px}
.progress-card{margin-top:12px;border:1px solid #eaecf0;border-radius:10px;padding:10px;background:#f8fafc}
.progress-head{display:flex;justify-content:space-between;align-items:center;font-size:11px}
.progress-head span{color:var(--muted)}
.progress-track{height:7px;border-radius:999px;background:#e4e7ec;margin-top:8px;overflow:hidden}
.progress-bar{height:100%;width:0;background:var(--accent);transition:width .25s ease}
#moduleNav button span{flex:1}
#moduleNav button i{font-style:normal;font-size:10px;color:#98a2b3}
#moduleNav button i.done{color:#067647;font-weight:600}
#moduleNav button i.partial{color:#b54708;font-weight:600}
.check-button{width:100%;border:1px solid var(--line);border-radius:9px;background:#fff;color:#344054;padding:9px;margin-top:9px;cursor:pointer}
