:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#203342;background:#f4f7fa;font-size:16px}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 4%;background:#fff;border-bottom:1px solid #d6e0e8}.brand{display:flex;align-items:center;gap:12px}.mark{background:#1b4663;color:#fff;font-size:32px;border-radius:10px;padding:2px 12px}h1{font-size:22px;margin:0;letter-spacing:-.6px}h2{font-size:19px;margin:0 0 8px}p{line-height:1.55;margin:6px 0}.brand p,.privacy,.note{font-size:14px;color:#596f80}.brand p{margin:2px 0 0}main{max-width:1600px;margin:30px auto;padding:0 4%}.upload{display:flex;align-items:center;justify-content:space-between;gap:24px;border:2px dashed #9bafc0;border-radius:12px;background:white;padding:26px}.upload.drag{border-color:#1465ac;background:#eaf4ff}.upload p{color:#596f80}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}button,.button,select{font:inherit;font-size:14px;border-radius:7px;border:1px solid #b5c5d2;padding:10px 14px;background:white;color:#203342;cursor:pointer;display:inline-block}button:hover,.button:hover{background:#e8f0f6}.primary{background:#1b4663;color:white;border-color:#1b4663}.primary:hover{background:#285d7e}button:focus-visible,.button:focus-within,select:focus-visible{outline:3px solid #438cbd;outline-offset:3px}#file{position:absolute;width:1px;height:1px;opacity:0}.upload:focus-within{border-color:#1465ac}#status{font-size:14px;margin:12px 0 24px;color:#596f80}#error{padding:14px;border:1px solid #d9a2a2;background:#fff0f0;color:#8d2020;border-radius:8px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}.toolbar p{font-size:14px;color:#596f80}.toolbar h2{overflow-wrap:anywhere}.toolbar label{font-size:14px}.legend{display:flex;gap:18px;flex-wrap:wrap;font-size:14px;margin:16px 0;color:#526574}.badge{font-size:12px;border-radius:3px;padding:2px 4px;display:inline-block;min-width:25px;text-align:center}.pk{background:#fff0bf;color:#725000}.fk{background:#dcecff;color:#155588}#diagram{height:560px;overflow:auto;background-color:#edf2f6;background-image:radial-gradient(#c3d0da .8px,transparent .8px);background-size:18px 18px;border:1px solid #bdcdd9;border-radius:10px;position:relative}#canvas{position:relative;min-width:100%;min-height:100%}#lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.table-card{position:absolute;width:270px;border:1px solid #9eb4c5;border-radius:7px;background:#fff;box-shadow:0 3px 8px #193c5712;overflow:hidden}.table-card.selected{outline:3px solid #267bb2}.table-title{display:block;background:#1b4663;color:white;border:0;border-radius:0;width:100%;padding:12px 14px;text-align:left;font-weight:650;cursor:grab;touch-action:none;overflow-wrap:anywhere}.table-title:hover{background:#285d7e}.field{display:grid;grid-template-columns:55px minmax(0,1fr) 70px;gap:7px;border-top:1px solid #e7edf2;padding:8px 11px;font-size:14px;align-items:start;cursor:pointer}.field-name{overflow-wrap:anywhere}.field-type{font-size:12px;color:#5a7182;overflow-wrap:anywhere;text-align:right}.field .badge{margin-right:2px;min-width:22px;font-size:11px}.details{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:28px}.details>section{min-width:0}.relation{border-bottom:1px solid #d4dee6;padding:12px 0;font-size:14px}.relation b{overflow-wrap:anywhere}.relation small{display:block;color:#526574;line-height:1.6;font-size:14px;margin-top:4px}.data-scroll{overflow:auto;max-height:390px}table{border-collapse:collapse;background:white;width:100%;font-size:14px}th,td{padding:9px 12px;text-align:left;border-bottom:1px solid #dbe3ea;white-space:nowrap;max-width:350px;overflow:hidden;text-overflow:ellipsis}th{position:sticky;top:0;background:#e4edf4;color:#234864}.empty{text-align:center;padding:65px 20px}.empty-icon{font-size:45px;color:#547791;letter-spacing:8px;margin-bottom:20px}.empty p{color:#596f80}.empty .note{margin-top:24px}footer{text-align:center;font-size:13px;color:#657d8d;padding:30px} [hidden]{display:none!important}@media(max-width:760px){header{align-items:start}.privacy{max-width:130px;font-size:12px}.upload{flex-direction:column;align-items:start;padding:20px}.details{grid-template-columns:1fr}#diagram{height:480px}.toolbar .actions{width:100%}main{padding:0 18px}.empty{padding:40px 0}}
:root #stage{position:absolute;top:0;left:0;transform-origin:top left}.zoom{justify-content:flex-end;margin-bottom:8px}
