:root{font:14px system-ui,Inter,'Segoe UI',sans-serif;background:#101722;color:#eaf0f6}*{box-sizing:border-box}body{margin:0}header{padding:18px 4vw;background:#172431;border-bottom:1px solid #364858;display:flex;align-items:center;justify-content:space-between;gap:20px}header>span{color:#92b8bf;font-size:12px}.brand{display:flex;align-items:center;gap:14px}.mark{width:43px;height:43px;border-radius:7px;background:#34475d;border:1px solid #869cba;color:#f4fafc;display:grid;place-items:center;font:30px Georgia}.brand strong{font-size:19px}.brand em{color:#74bce4;font-style:normal}.brand small{display:block;margin-top:4px;color:#9cacc8;font-size:10px;letter-spacing:1.6px}main{max-width:1500px;margin:auto;padding:26px 24px}.hero{background:radial-gradient(ellipse at 85% 0,#365c8070,transparent 60%),#1e3144;border:1px solid #48647a;border-radius:12px;padding:38px;display:flex;justify-content:space-between;align-items:center;gap:20px}.hero small{font-size:10px;letter-spacing:1.8px;color:#96c6e9}h1{font:clamp(30px,3vw,46px)/1.2 Georgia;margin:15px 0}.hero em{font-style:normal;color:#90c4e5}.hero p{color:#bbcbdc;line-height:1.5;max-width:680px}.upload{background:#2075a4;color:#f8fbff;border:1px dashed #a1d5ef;padding:17px;border-radius:7px;cursor:pointer;white-space:nowrap}button,input{font:inherit}button{background:#2b4057;border:1px solid #5c7892;color:#e8f4fa;border-radius:5px;padding:9px 12px;cursor:pointer}button:hover{background:#3d5d79}button:disabled{opacity:.45;cursor:not-allowed}.primary{background:#287dac;border-color:#6dc3f1}.actions{display:flex;justify-content:space-between;gap:9px;margin:17px 0;flex-wrap:wrap}.actions>div{display:flex;gap:6px;flex-wrap:wrap}.workspace{display:grid;grid-template-columns:300px minmax(0,1fr);gap:16px;min-height:570px}.workspace aside,.preview{background:#192735;border:1px solid #415669;border-radius:9px;min-width:0}aside{padding:16px}aside h2{font:25px Georgia;margin:0}.list{max-height:700px;overflow-y:auto;display:grid;gap:8px}.pageBtn{display:flex;align-items:center;gap:12px;text-align:left;width:100%}.pageBtn.selected{background:#275d7a;border-color:#79b7d8}.pageNumber{width:37px;height:46px;background:#e5e9eb;color:#3a4b58;border-radius:4px;display:grid;place-items:center;font-size:13px;flex-shrink:0}.pageMeta{display:grid;gap:3px;min-width:0}.pageMeta span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:185px}.pageMeta small{color:#a3b6c6}.previewHead{display:flex;align-items:center;justify-content:space-between;padding:14px;border-bottom:1px solid #354e61}.previewHead span{font-size:12px;color:#b7cad7}.previewBody{min-height:460px;background:repeating-conic-gradient(#2d3c47 0 25%,#22303c 0 50%) 50%/30px 30px;display:grid;place-items:center;padding:20px;overflow:auto}#previewCanvas{display:block;max-width:100%;height:auto;background:#fff;box-shadow:0 10px 45px #0008}#empty{color:#a8bccd}h3{margin:0 0 16px;font-size:15px}.annotation{padding:19px}.form{display:grid;grid-template-columns:minmax(180px,2fr) repeat(4,minmax(85px,1fr));gap:10px;align-items:end}.form label{display:grid;gap:5px;font-size:11px;color:#afc8d4}.form input{background:#111c2a;color:#f1f5f9;border:1px solid #4e6476;border-radius:4px;padding:8px;width:100%;min-width:0}.form input[type=color]{height:36px;padding:2px}.annotation>button{margin-top:13px}.annotationRow{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid #354b5e;padding:8px 0;font-size:12px}.annotationRow span{max-width:80%;overflow-wrap:anywhere}.annotationRow button{padding:4px 8px}.warning{border:1px solid #796747;background:#322c20;color:#e6d5b2;padding:15px;border-radius:8px;line-height:1.6;margin-top:20px}footer{margin:30px 0;font-size:10px;text-align:center;letter-spacing:1.5px;color:#8597aa}@media(max-width:800px){.workspace{grid-template-columns:1fr}.list{max-height:210px}.hero{padding:22px;display:block}.upload{display:inline-block;margin-top:12px}.form{grid-template-columns:repeat(2,1fr)}.form label:first-child{grid-column:1/-1}}