:root{font-family:'Manrope',sans-serif;color:#f3f0e9;background:#161616;font-synthesis:none;--accent:#79adff;--soft:rgba(121,173,255,.13);--line:#3b3b3b;--muted:#9c9a94}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:radial-gradient(circle at 86% 4%,var(--soft),transparent 26%),#171717}button,a,summary{color:inherit}.grain{position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.topbar{height:70px;padding:0 max(25px,5vw);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #353535;background:rgba(21,21,21,.82);backdrop-filter:blur(15px);position:relative;z-index:10}.brand{text-decoration:none;font-size:14px;letter-spacing:-.045em}.brand strong{font-weight:800}.header-note{color:#777;font-size:9px;letter-spacing:.12em}.particles i{position:fixed;width:3px;height:3px;border-radius:50%;background:var(--accent);opacity:.4;animation:float 11s ease-in-out infinite}.particles i:nth-child(1){left:10%;top:25%}.particles i:nth-child(2){left:25%;top:75%;animation-delay:-4s}.particles i:nth-child(3){left:46%;top:35%;animation-delay:-7s}.particles i:nth-child(4){left:65%;top:68%;animation-delay:-2s}.particles i:nth-child(5){left:82%;top:20%;animation-delay:-8s}.particles i:nth-child(6){left:93%;top:55%;animation-delay:-5s}@keyframes float{50%{transform:translate(14px,-20px) scale(1.7);opacity:.12}}
main{max-width:1240px;margin:auto;padding:80px 5vw 120px;position:relative;z-index:1}.eyebrow{color:var(--accent);font-size:10px;font-weight:700;letter-spacing:.14em;margin:0 0 14px}.hero{min-height:330px;display:flex;flex-direction:column;justify-content:center}.hero h1{font-size:clamp(50px,7vw,86px);letter-spacing:-.075em;line-height:.94;margin:0}.hero h1 em{font:italic 500 1em 'Playfair Display',serif;color:var(--accent)}.hero-copy{color:var(--muted);font-size:14px;line-height:1.8;max-width:600px;margin:30px 0 0}.activity{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.activity>summary{list-style:none;display:grid;grid-template-columns:55px 1fr auto 28px;align-items:center;padding:25px 4px;cursor:pointer}.activity>summary::-webkit-details-marker{display:none}.activity>summary>span{color:var(--accent);font:italic 18px 'Playfair Display',serif}.activity>summary strong{font-size:20px}.activity>summary small{color:#777;font-size:10px;letter-spacing:.08em;margin-right:32px}.activity>summary i{font-style:normal;font-size:22px;transition:transform .4s}.activity[open]>summary i{transform:rotate(180deg)}.activity-body{border-top:1px solid var(--line);animation:reveal .5s ease both}@keyframes reveal{from{opacity:0;transform:translateY(12px)}}.legend{display:flex;gap:12px;align-items:center;padding:20px 0;color:#85837e;font-size:11px;line-height:1.6}.legend p{margin:0}.legend-dot{width:7px;height:7px;flex:none;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px var(--soft)}
.diagram-section{padding:55px 0 35px;border-top:1px solid #303030}.section-heading{display:grid;grid-template-columns:120px 1fr auto;align-items:baseline;margin-bottom:28px}.section-heading .eyebrow{margin:0}.section-heading h2{font-size:clamp(30px,4vw,48px);letter-spacing:-.055em;margin:0}.section-heading>span{color:#777;font-size:9px;text-transform:uppercase;letter-spacing:.1em}.diagram-scroll{overflow-x:auto;overflow-y:hidden;padding-bottom:10px;scrollbar-color:#555 #242424}.conceptual-diagram{display:block;width:100%;min-width:1050px;background:rgba(25,25,25,.76)}.conceptual-diagram text{font-family:'Manrope',sans-serif;fill:#d6d3cc;font-size:17px}.conceptual-diagram .entity,.conceptual-diagram .attribute,.conceptual-diagram .relation polygon{fill:#202020;stroke:#777;stroke-width:1.5;transition:fill .25s,stroke .25s,filter .25s}.conceptual-diagram .double{fill:none;stroke:#777;stroke-width:1}.conceptual-diagram line,.conceptual-diagram .connections path{stroke:#666;stroke-width:1.5;fill:none}.conceptual-diagram .entity-label{font-size:22px;font-weight:600;fill:#f2efe8}.conceptual-diagram .key{text-decoration:underline}.conceptual-diagram .cardinality{font-size:13px;fill:#8d8a84}.model-target{cursor:pointer;transition:opacity .25s,filter .25s}.conceptual-diagram .model-target.is-active .entity,.conceptual-diagram .model-target.is-active .attribute,.conceptual-diagram .model-target.is-active polygon{fill:rgba(121,173,255,.16);stroke:var(--accent);filter:drop-shadow(0 0 7px rgba(121,173,255,.25))}.conceptual-diagram .model-target.is-active text{fill:#fff}.has-selection .model-target:not(.is-active){opacity:.3}
.logical-scroll{background:rgba(25,25,25,.76)}.logical-diagram{width:1200px;height:760px;position:relative;margin:auto}.logical-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.logical-lines path{fill:none;stroke:#686868;stroke-width:2}.table-node{position:absolute;background:#202020;border:1px solid #777;transition:border-color .25s,box-shadow .25s,opacity .25s,transform .25s}.table-node:hover,.table-node.is-active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 16px 42px rgba(0,0,0,.28);transform:translateY(-3px)}.table-node h3{font-size:17px;text-align:center;letter-spacing:.03em;margin:0;padding:9px;background:linear-gradient(90deg,#343434,#292929);border-bottom:1px solid #666}.table-node table{width:100%;border-collapse:collapse;font-size:11px}.table-node th,.table-node td{text-align:left;padding:7px 9px;border-right:1px solid #555;border-bottom:1px solid #4a4a4a;vertical-align:top}.table-node th:last-child,.table-node td:last-child{border-right:0}.table-node th{font-weight:400;color:#aaa}.table-node td{color:#ddd}.table-node u{font-weight:700}.categoria-table{left:20px;top:70px;width:300px}.produto-table{left:390px;top:70px;width:365px}.cliente-table{right:20px;top:45px;width:355px}.pedido-table{left:470px;top:350px;width:360px}.item-table{left:470px;top:565px;width:390px}.logical-diagram.has-selection .model-target:not(.is-active){opacity:.28}
.explanation{max-width:900px;margin:70px auto 25px;padding:65px 70px;background:#e9e2d5;color:#302d29}.explanation .eyebrow{color:#855f55}.explanation h2{font:500 clamp(35px,5vw,55px)/1.05 'Playfair Display',serif;letter-spacing:-.045em;margin:0 0 38px}.explanation p:not(.eyebrow){font:17px/1.9 'Playfair Display',serif;color:#575149;margin:0 0 24px}.explanation strong{font-weight:600;color:#302d29}footer{max-width:1240px;margin:auto;border-top:1px solid #343434;padding:25px 5vw;display:flex;justify-content:space-between;color:#777;font-size:9px;letter-spacing:.08em;text-transform:uppercase}footer i{width:6px;height:6px;border-radius:50%;background:var(--accent)}
@media(max-width:760px){.topbar{height:60px;padding:0 22px}.header-note{display:none}main{padding:55px 22px 80px}.hero{min-height:300px}.activity>summary{grid-template-columns:40px 1fr 22px}.activity>summary small{display:none}.section-heading{grid-template-columns:1fr}.section-heading h2{margin:8px 0}.section-heading>span{margin-top:5px}.conceptual-diagram{min-width:950px}.explanation{padding:42px 27px;margin-top:50px}.explanation p:not(.eyebrow){font-size:16px}.legend{align-items:flex-start}.activity-body{border-top:1px solid var(--line)}footer{margin:0 22px;padding:22px 0;gap:15px;flex-wrap:wrap}footer span:nth-child(2){order:3;width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}