:root{--bg-0: #060b12;--bg-1: #0a1222;--bg-2: #13213c;--surface: rgba(12, 19, 35, .74);--surface-border: rgba(170, 200, 255, .22);--text: #eef5ff;--muted: #9db1cf;--accent: #6de6cf;--accent-2: #9db8ff;--danger: #ff8e84}*,*:before,*:after{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{background:var(--bg-0);color:var(--text);font-family:Avenir Next,Segoe UI,sans-serif;overflow:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button,input,select,textarea{font:inherit}.landing{position:relative;width:100%;height:100%;overflow-y:auto;background:radial-gradient(64% 90% at 0% 0%,rgba(108,236,228,.16),transparent 70%),radial-gradient(52% 78% at 100% 100%,rgba(125,143,255,.22),transparent 72%),linear-gradient(136deg,var(--bg-0),var(--bg-1) 52%,var(--bg-2))}.landing:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 18% 22%,rgba(178,216,255,.08),transparent 28%),radial-gradient(circle at 80% 75%,rgba(160,198,255,.07),transparent 32%)}.landing-content{position:relative;max-width:1280px;margin:0 auto;padding:clamp(28px,4vw,54px) clamp(16px,2vw,28px) 110px}.hero{margin-bottom:26px}.hero-title-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}.hero-links{display:inline-flex;align-items:center;gap:12px}.hero-link{color:var(--muted);text-decoration:none;font-weight:550;letter-spacing:.01em;transition:color .14s ease}.hero-link:hover{color:var(--text)}.hero-title{margin:0;font-family:Futura,Avenir Next Condensed,sans-serif;font-size:clamp(54px,8vw,88px);line-height:.9;letter-spacing:-.05em}.hero-tagline{margin:8px 0 0;font-size:clamp(20px,2vw,26px);font-weight:590;color:var(--accent)}.hero-desc{max-width:66ch;margin:12px 0 0;color:var(--muted);line-height:1.5}.hero-actions{display:flex;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}.install-cmd{display:inline-block;padding:8px 12px;border-radius:9px;border:1px solid rgba(165,199,255,.27);background:#080d18b8;color:var(--accent-2);font-family:SF Mono,Menlo,Monaco,Consolas,monospace;font-size:13px}.hero-note{margin:12px 0 0;color:#b1c1dce0;font-family:SF Mono,Menlo,Monaco,Consolas,monospace;font-size:12px}.demo-section{position:relative}.demo-hint{margin:0 0 14px;color:var(--muted);font-size:14px}.mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:14px}.mini-tile{min-height:320px;border:1px solid var(--surface-border);border-radius:18px;background:linear-gradient(180deg,#ffffff08,#ffffff03),var(--surface);box-shadow:inset 0 1px #ffffff14,0 18px 40px #03081057;-webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);display:flex;flex-direction:column}.tile-head{padding:14px 14px 10px;border-bottom:1px solid rgba(147,179,226,.17)}.tile-head h2{margin:0;font-size:15px;letter-spacing:.01em}.tile-head p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.35}.tile-body{padding:12px;display:flex;flex-direction:column;gap:10px;height:100%}.demo-row{display:flex;gap:8px;flex-wrap:wrap}.demo-btn{border:1px solid rgba(178,202,245,.24);border-radius:9px;padding:7px 10px;font-size:12px;font-weight:560;cursor:pointer;transition:transform .1s ease,filter .12s ease,border-color .12s ease}.demo-btn:active{transform:translateY(1px)}.demo-btn-primary{background:linear-gradient(135deg,#65e9cd,#74b3ff);color:#032430;border-color:#aee0ffb8}.demo-btn-secondary{background:#0a111fcc;color:var(--text)}.demo-btn:hover{filter:brightness(1.08)}.demo-label{color:var(--muted);font-size:12px;font-weight:560}.form-playground .form-grid{display:grid;gap:7px}.demo-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;border:1px solid rgba(176,206,255,.25);border-radius:8px;background:#080e19c7;color:var(--text);padding:8px 10px;font-size:13px;line-height:1.35;outline:none}.demo-input:focus{border-color:#75cee2e6;box-shadow:0 0 0 2px #6de6cf2e}.demo-input::placeholder{color:#acbed88c}.demo-textarea{resize:vertical;min-height:52px}.checkbox-row{display:inline-flex;align-items:center;gap:8px}.checkbox-row input{width:14px;height:14px}.slider-label{display:flex;justify-content:space-between}.demo-range{width:100%}.demo-meta{margin-top:auto;color:#b2c3dce6;font-family:SF Mono,Menlo,Monaco,Consolas,monospace;font-size:11px;line-height:1.4}.clock-tile{align-items:center}.clock-face{width:100%;max-width:190px;aspect-ratio:1}.clock-outer{fill:#080d1af0;stroke:#a4c7f552;stroke-width:1.3}.clock-inner{fill:#0e182ad6}.clock-tick{fill:#c6deffd1}.clock-hand-wrap{cursor:grab}.clock-hand{stroke-linecap:round}.clock-hand.hour{stroke:#f4f8ff;stroke-width:4.4}.clock-hand.minute{stroke:#9de8ff;stroke-width:3.2}.clock-hand.second{stroke:#ff8d89;stroke-width:1.7}.clock-pin{fill:#dce8ff}.clock-meta{display:grid;gap:2px;text-align:center;color:var(--muted);font-size:12px}.particle-canvas{width:100%;border-radius:10px;border:1px solid rgba(161,196,255,.25);background:#090f1f}.tile-controls{display:flex;gap:8px}.kanban-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.kanban-column{border:1px solid rgba(166,196,255,.2);border-radius:10px;padding:6px;background:#080c17bd;min-height:172px;transition:border-color .14s ease,transform .12s ease}.kanban-column.is-hover{border-color:#70eac8f2;transform:translateY(-1px)}.kanban-column-header{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted);margin-bottom:5px}.kanban-column-header span{padding:1px 5px;border-radius:999px;background:#70eac833;color:#aaf5e8}.kanban-cards{display:grid;gap:5px}.kanban-card{width:100%;text-align:left;border:1px solid rgba(172,197,240,.24);border-radius:8px;background:#111b2ef2;color:#e6efff;font-size:11px;line-height:1.3;padding:7px;cursor:grabbing}.kanban-card.is-dragging{outline:1px solid rgba(112,234,200,.95)}.drawing-toolbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.tool-btn{border:1px solid rgba(170,202,255,.22);border-radius:8px;background:#070d1ac7;color:var(--muted);font-size:11px;text-transform:capitalize;padding:6px 0;cursor:pointer}.tool-btn.is-active{border-color:#70eac8e6;color:#c3fff1;background:#122734b8}.drawing-surface{width:100%;border-radius:10px;border:1px solid rgba(161,196,255,.24);background:linear-gradient(180deg,#0a0f1bf0,#080d18f5)}.resize-handle{fill:#eaf4ff;stroke:#0c2338;stroke-width:1;cursor:nwse-resize}@media(max-width:760px){.landing-content{padding-bottom:140px}.mini-grid{grid-template-columns:repeat(1,minmax(0,1fr))}.mini-tile{min-height:300px}}
