/* TAEDS Platform Architecture — reference documentation styles.
   Visual system mirrors the Resortify "cloud-manifesto" design tokens. */
:root{
  --bg:#F4F6FA;--bg-grid:#E4E9F2;--surface:#FFFFFF;--surface-2:#EDF1F7;
  --ink:#0F1B2E;--ink-soft:#4B5A72;--ink-faint:#8493A8;
  --border:#D6DEE9;--border-strong:#B9C6D8;
  --accent:#0E8E86;--accent-ink:#066560;--accent-soft:#DCF3F1;
  --amber:#C9760A;--amber-soft:#FBEBD6;
  --blue:#3457D5;--blue-soft:#E4E9FC;
  --danger:#B3352C;--danger-soft:#F9E3E1;
  --violet:#6B46C1;--violet-soft:#EDE8FB;
  --shadow:0 1px 2px rgba(15,27,46,.04),0 8px 24px -12px rgba(15,27,46,.12);
  --radius:0px;
  --font-display:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Arial,sans-serif;
  --font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Arial,sans-serif;
  --font-mono:"IBM Plex Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
html.dark{
  --bg:#0A121F;--bg-grid:#0F1B2E;--surface:#101B2C;--surface-2:#16233A;
  --ink:#EAF0F8;--ink-soft:#A9B8CD;--ink-faint:#6B7D96;
  --border:#22314A;--border-strong:#324563;
  --accent:#2DD9C8;--accent-ink:#8FF3E7;--accent-soft:#0F2E30;
  --amber:#F0A93C;--amber-soft:#2E220E;
  --blue:#7C93FF;--blue-soft:#161E3D;
  --danger:#F0665C;--danger-soft:#3A1D1B;
  --violet:#B79DFF;--violet-soft:#211A3A;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 12px 32px -14px rgba(0,0,0,.6);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;transition:background-color .35s ease,color .35s ease;min-height:100vh}
::selection{background:var(--accent);color:var(--surface)}
h1,h2,h3,.mono-label{font-family:var(--font-display);letter-spacing:-.01em}
 .eyebrow{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink);display:flex;align-items:center;gap:8px}
.eyebrow::before{content:"";width:16px;height:1px;background:var(--accent);display:inline-block}
.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:12px 28px;background:#0F1B2E;border-bottom:3px solid #D6A514}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand-logo{width:42px;height:42px;object-fit:contain;flex-shrink:0}
.brand-text{min-width:0}
 .brand-title{display:block;font-family:var(--font-display);font-weight:700;font-size:21px;line-height:1;color:#ffffff;letter-spacing:.01em}
.brand-sub{display:block;font-family:var(--font-mono);font-weight:500;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#A9B8CD;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .doc-tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#F5D76E;border:1px solid rgba(255,255,255,.28);padding:7px 12px;margin-right:2px;white-space:nowrap}
@media(max-width:1000px){.doc-tag{display:none}}
.brand-logo{filter:drop-shadow(0 1px 0 rgba(0,0,0,.2))}
.topbar-actions{display:flex;align-items:center;gap:8px}
.topbar .icon-btn{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.22);color:#E7EDF5}
.topbar .icon-btn:hover{background:rgba(255,255,255,.16);color:#fff}
.topbar .back-link{border:1px solid rgba(255,255,255,.3);color:#E7EDF5}
.topbar .back-link:hover{border-color:#D6A514;color:#fff}
.icon-btn{width:36px;height:36px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;font-family:var(--font-body)}
.icon-btn:hover{border-color:var(--border-strong);color:var(--ink);background:var(--surface-2)}
.icon-btn svg{width:17px;height:17px;display:block}
.back-link{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);border:1px solid var(--border);padding:8px 14px;text-decoration:none;transition:border-color .18s ease,color .18s ease}
.back-link:hover{border-color:var(--accent);color:var(--accent-ink)}
.shell{display:flex;max-width:1680px;margin:0 auto}
.toc{width:250px;flex-shrink:0;position:sticky;top:65px;align-self:flex-start;height:calc(100vh - 65px);overflow-y:auto;padding:32px 12px 32px 24px;scrollbar-width:thin}
.toc::-webkit-scrollbar{width:6px}
.toc::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
.toc-title{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:14px;padding-left:12px}
 .toc a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:7px;text-decoration:none;color:var(--ink-soft);font-size:15px;font-weight:500;border-left:2px solid transparent;transition:all .15s ease}
 .toc a .num{font-family:var(--font-mono);font-size:12px;color:var(--ink-faint);width:22px;flex-shrink:0}
.toc a:hover{color:var(--ink);background:var(--surface-2)}
.toc a.active{color:var(--accent-ink);border-left-color:var(--accent);background:var(--accent-soft)}
.toc a.active .num{color:var(--accent-ink)}
.toc .toc-group{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);padding:18px 12px 6px}
.main{flex:1;min-width:0;padding:0 34px 80px}
 .hero{padding:70px 0 40px;max-width:1320px}
 .hero h1{font-size:clamp(36px,5vw,62px);font-weight:600;line-height:1.08;margin:18px 0 20px}
.hero h1 em{font-style:normal;color:var(--accent-ink)}
  .hero p{font-size:19px;line-height:1.7;color:var(--ink-soft);max-width:1240px}
.owns-strip{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.owns-chip{font-family:var(--font-mono);font-size:12.5px;padding:6px 11px;border:1px solid var(--border-strong);border-radius:100px;color:var(--ink-soft);background:var(--surface)}
.principles{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-top:38px}
.principle{background:var(--surface);padding:22px 18px;cursor:default;transition:background .15s ease}
.principle:hover{background:var(--surface-2)}
.principle .p-icon{width:26px;height:26px;color:var(--accent);margin-bottom:12px}
.principle .p-icon svg{width:100%;height:100%;display:block}
 .principle h4{font-size:16px;font-weight:600;margin-bottom:6px}
 .principle p{font-size:14.5px;color:var(--ink-soft);line-height:1.55}
.diagram-section{padding:62px 0;border-top:1px solid var(--border);scroll-margin-top:78px}
.diagram-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:22px;flex-wrap:wrap}
 .diagram-head h2{font-size:32px;font-weight:600;margin:10px 0 8px}
 .diagram-head p{font-size:17px;color:var(--ink-soft);max-width:640px;line-height:1.55}
 .diagram-index{font-family:var(--font-mono);font-size:54px;font-weight:600;color:var(--border-strong);line-height:1}
.diagram-frame{background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);padding:8px;overflow:hidden}
.diagram-frame-inner{background:#f2f3f5;border-radius:9px;padding:22px;overflow-x:auto;-webkit-overflow-scrolling:touch}
html.dark .diagram-frame-inner{background:#f2f3f5}
.diagram-frame svg{width:100%;min-width:700px;height:auto;display:block;overflow:visible}
@media(max-width:700px){.diagram-frame svg{min-width:760px}.diagram-frame-inner:after{content:"↔ scroll to see full diagram";display:block;text-align:center;font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);padding-top:12px}}
.legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:16px;padding:0 4px}
 .legend-item{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-soft)}
 .legend-swatch{width:14px;height:14px;border-radius:3px;flex-shrink:0}
/* SVG node styles */
.node-box{fill:var(--surface);stroke:var(--border-strong);stroke-width:1.25;transition:stroke .15s ease,fill .15s ease}
.node-group{cursor:pointer}
.node-group:hover .node-box{stroke:var(--accent);fill:var(--accent-soft)}
.node-label{fill:var(--ink);font-family:var(--font-body);font-weight:600}
.node-sub{fill:var(--ink-faint);font-family:var(--font-mono)}
.node-icon{stroke:var(--accent-ink);fill:none;stroke-width:1.6}
.node-group:hover .node-icon{stroke:var(--accent-ink)}
.layer-band{fill:var(--surface-2);stroke:var(--border);stroke-width:1}
.layer-label{fill:var(--ink-soft);font-family:var(--font-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase}
.layer-index{fill:var(--ink-faint);font-family:var(--font-mono);font-weight:600}
.flow-line{stroke:var(--border-strong);stroke-width:1.5;fill:none}
.flow-line.animated{stroke:var(--accent);stroke-dasharray:5 5;animation:dash 1.1s linear infinite}
.flow-line.amber{stroke:var(--amber);stroke-dasharray:3 6;animation:dash 1.4s linear infinite}
.flow-line.blue{stroke:var(--blue);stroke-dasharray:4 6;animation:dash 1.25s linear infinite}
.flow-line.danger{stroke:var(--danger)}
.flow-arrowhead{fill:var(--border-strong)}
.flow-arrowhead.accent{fill:var(--accent)}
.flow-arrowhead.amber{fill:var(--amber)}
.flow-arrowhead.blue{fill:var(--blue)}
@keyframes dash{to{stroke-dashoffset:-20}}
.boundary-box{fill:none;stroke:var(--accent);stroke-width:1.4;stroke-dasharray:4 4}
.boundary-tag{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1}
.boundary-tag-text{fill:var(--accent-ink);font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.svg-caption{fill:var(--ink-faint);font-family:var(--font-mono);font-size:10px}
 #diagram-tooltip{position:fixed;z-index:200;pointer-events:none;background:var(--ink);color:var(--bg);font-size:14px;line-height:1.45;font-family:var(--font-body);padding:10px 13px;border-radius:8px;max-width:260px;box-shadow:0 10px 30px -8px #0006;opacity:0;transform:translateY(4px);transition:opacity .12s ease,transform .12s ease}
#diagram-tooltip.show{opacity:1;transform:translateY(0)}
 #diagram-tooltip .tt-title{font-weight:600;font-size:15px;margin-bottom:4px;font-family:var(--font-display)}
html.dark #diagram-tooltip{background:var(--surface-2);color:var(--ink);border:1px solid var(--border-strong)}
/* Documentation blocks (prose) */
.docs{margin-top:22px;display:grid;gap:14px}
.docs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.doc-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px 18px;box-shadow:var(--shadow)}
 .doc-card h4{font-size:15.5px;font-weight:600;margin-bottom:8px;display:flex;align-items:center;gap:8px}
.doc-card h4 .dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0}
 .doc-card p, .doc-card li{font-size:14.5px;color:var(--ink-soft);line-height:1.6}
.doc-card ul{list-style:none;display:grid;gap:6px}
.doc-card li{padding-left:14px;position:relative}
.doc-card li::before{content:"▸";position:absolute;left:0;color:var(--accent-ink);font-size:10px;top:2px}
 .doc-card code, .doc-card .mono{font-family:var(--font-mono);font-size:12.5px;background:var(--surface-2);border:1px solid var(--border);border-radius:4px;padding:1px 5px;color:var(--ink)}
.docs-table-wrap{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow-x:auto;box-shadow:var(--shadow)}
 .docs-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:560px}
 .docs-table th{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);text-align:left;padding:12px 16px;border-bottom:1px solid var(--border);background:var(--surface-2)}
.docs-table td{padding:10px 16px;border-bottom:1px solid var(--border);color:var(--ink-soft);vertical-align:top;line-height:1.5}
.docs-table td:first-child,.docs-table th:first-child{color:var(--ink);font-weight:500}
 .docs-table code{font-family:var(--font-mono);font-size:13px;color:var(--accent-ink)}
.docs-table tr:last-child td{border-bottom:none}
 .callout{display:flex;gap:12px;align-items:flex-start;background:var(--amber-soft);border:1px solid var(--amber);border-radius:12px;padding:15px 18px;font-size:15px;color:var(--ink);line-height:1.55}
.callout .ic{flex-shrink:0;color:var(--amber)}
.callout.accent{background:var(--accent-soft);border-color:var(--accent)}
.callout.accent .ic{color:var(--accent-ink)}
.callout.blue{background:var(--blue-soft);border-color:var(--blue)}
.callout.blue .ic{color:var(--blue)}
/* Code + cmd styles */
.cmdline{display:block;font-family:var(--font-mono);font-size:11.5px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-top:6px;overflow-x:auto;white-space:pre;color:var(--ink)}
.footer{border-top:1px solid var(--border);margin-top:40px;padding:36px 0 60px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px}
.footer p{font-size:13px;color:var(--ink-faint);font-family:var(--font-mono)}
@media(max-width:1080px){.toc{display:none}.principles{grid-template-columns:repeat(2,1fr)}.main{padding:0 22px 60px}}
@media(max-width:620px){.principles{grid-template-columns:1fr}.diagram-head{flex-direction:column;align-items:flex-start}.main{padding:0 14px 50px}.topbar{padding:12px 16px}}
@media(prefers-reduced-motion:reduce){.flow-line.animated,.flow-line.amber,.flow-line.blue{animation:none;stroke-dasharray:none}html{scroll-behavior:auto}}
@media print{body{background:#fff!important}.topbar,.toc{display:none!important}.shell{display:block}.diagram-section{break-inside:avoid;page-break-inside:avoid}.diagram-frame{box-shadow:none;border:1px solid #ccc}.diagram-frame-inner{background:none!important}.docs-grid{break-inside:avoid}}

/* ---- Zero border-radius across the whole document ---- */
*, *::before, *::after{ border-radius:0 !important; }
#diagram-tooltip{ border-radius:0 !important; }
html.dark #diagram-tooltip{ border-radius:0 !important; }

/* ---- Dark mode refinements (diagrams follow the theme) ---- */
html.dark .diagram-frame{background:var(--surface);border-color:var(--border)}
html.dark .diagram-frame-inner{background:var(--bg)}
html.dark .node-box{fill:var(--surface-2);stroke:var(--border-strong)}
html.dark .node-group:hover .node-box{fill:var(--accent-soft);stroke:var(--accent)}
html.dark .layer-band{fill:#0E1826;stroke:var(--border)}
html.dark .layer-label,.html.dark .layer-index{fill:var(--ink-soft)}
html.dark .node-label{fill:var(--ink)}
html.dark .node-sub{fill:var(--ink-faint)}
html.dark .legend-swatch{border:1px solid var(--border-strong)}
html.dark .doc-tag{color:#E7C75A;border-color:rgba(255,255,255,.22)}