/* A quiet collection workspace, with color reserved for meaning and navigation. */
:root{--surface:#fff;--ink:#182b43;--canvas:#f3f5f8;--soft:#eef3f9}body{background:var(--canvas);color:var(--ink)}.brand-logo{width:44px;height:44px;object-fit:contain;border-radius:13px}.sidebar{background:linear-gradient(175deg,#152b45,#142438 75%,#243b4c)}.brand{font-size:21px}nav button{transition:background .18s,transform .18s}nav button:hover{background:#243e5c;transform:translateX(2px)}nav button.active{box-shadow:inset 3px 0 #8ed8cf}.hero{min-height:355px;display:grid;grid-template-columns:1.25fr .75fr;align-items:center;background:radial-gradient(ellipse at 90% 50%,#e1d9ed 0,transparent 60%),linear-gradient(115deg,#e0efee,#eef2fb 60%,#f4eadf);border:1px solid #d6e4e9}.hero h1{font-size:42px;font-weight:700;line-height:1.12;letter-spacing:-1.6px}.hero-copy{position:relative;z-index:1}.hero p{font-size:16px;max-width:500px}.hero-visual{height:290px;position:relative;display:flex;justify-content:center;align-items:center}.orbit{position:absolute;width:270px;height:270px;border:1px solid #aabacc77;border-radius:50%;box-shadow:0 0 0 25px #afc6d51a,0 0 0 60px #afc6d50d}.magic-card{position:absolute;width:150px;height:210px;border-radius:17px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 15px 30px #233b5730;border:2px solid #ffffffb0}.back-one{background:repeating-linear-gradient(45deg,#266f79,#266f79 8px,#327e86 8px,#327e86 9px);color:#c1e8dc;font-size:60px;transform:translate(-66px,8px) rotate(-19deg)}.back-two{background:repeating-linear-gradient(45deg,#806998,#806998 8px,#8c75a5 8px,#8c75a5 9px);color:#dfc9ef;font-size:60px;transform:translate(63px,6px) rotate(18deg)}.front-card{background:linear-gradient(150deg,#183e63,#183145);color:#edf6ff;transform:translateY(-15px) rotate(-3deg)}.front-card img{width:110px;height:110px;object-fit:contain}.front-card>span{font-size:14px;font-weight:700;letter-spacing:2px;margin-top:15px}.front-card>small{font-size:8px;letter-spacing:3px;margin-top:6px;color:#a3c6dc}.floating-chip{position:absolute;bottom:5px;background:#fffef8ed;border:1px solid #fff;border-radius:50px;box-shadow:0 6px 16px #22374e13;font-size:11px;color:#3e516c;padding:10px 14px;white-space:nowrap}.metric{position:relative;transition:transform .15s,box-shadow .15s;border-bottom-width:3px;cursor:pointer}.metric:hover{transform:translateY(-3px);box-shadow:0 8px 25px #1c304c0e}.metric-icon{position:absolute;right:15px;top:17px;border-radius:9px;padding:6px 9px;font-size:19px}.metric-teal{border-bottom-color:#67b1a5}.metric-teal .metric-icon{color:#248475;background:#e4f3ee}.metric-purple{border-bottom-color:#a18bc3}.metric-purple .metric-icon{color:#8162ab;background:#f1ebf7}.metric-blue{border-bottom-color:#759de0}.metric-blue .metric-icon{color:#487cc6;background:#e9f0fc}.metric-amber{border-bottom-color:#d5ac66}.metric-amber .metric-icon{color:#b1823e;background:#fbf0dd}.metric strong{font-size:34px}.panel{box-shadow:0 3px 15px #19304a03}.grid .card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:12px;transition:transform .15s,box-shadow .15s}.grid .card:hover{transform:translateY(-3px);box-shadow:0 9px 24px #1d304a14}.grid .card .art{border-radius:9px;box-shadow:none}.grid .card>button{width:100%}.folder-strip{display:flex;gap:13px;overflow-x:auto;padding:5px 0 22px}.folder{min-width:170px;max-width:230px;flex-shrink:0;display:flex;align-items:flex-start;flex-direction:column;text-align:left;background:var(--surface);color:var(--ink);border:1px solid var(--line);padding:20px;white-space:normal}.folder>span{font-size:27px;color:#6d82ad}.folder strong{font-size:14px;overflow-wrap:anywhere}.folder small{font-weight:400}.folder.selected{background:#edf3fc;border-color:#7d9ed2;box-shadow:0 3px 10px #234a8010}.new-folder{border-style:dashed;background:transparent}.toolbar select{width:auto;max-width:230px;margin:0}.empty-icon{font-size:43px;color:#7996be;display:block;margin-bottom:16px}.drop{padding:45px;background:radial-gradient(ellipse at top,#e5eefb,transparent),#f7fafc}.drop h2{font-size:25px}.drop p{max-width:580px;margin:14px auto 24px}dialog{padding:35px 32px}.row img{cursor:pointer}.row{gap:13px}.row strong{line-height:1.35}.row small{line-height:1.6}.row .grow{min-width:180px}.card .chip{margin-top:8px}.theme-toggle{font-size:12px}.grid .card img:not([src]),.grid .card img[src=""]{background:linear-gradient(135deg,#adc6d8,#d2dfeb)}
.dark{--surface:#1b2d42;--ink:#e4edf8;--canvas:#112034;--soft:#233b56;--line:#33485e;--muted:#adc0d3;--blue:#568de0}.dark body{background:var(--canvas);color:var(--ink)}.dark header,.dark .panel,.dark .metric,.dark dialog,.dark .listbutton,.dark input,.dark select,.dark textarea{background:var(--surface);color:var(--ink)}.dark .quiet{background:#243c57;color:#e2ecf8;border-color:#3f5774}.dark .hero{background:radial-gradient(ellipse at 85% 50%,#51416155,transparent 65%),linear-gradient(120deg,#1d454b,#253b59);border-color:#3c546e}.dark .hero p{color:#c3d7e8}.dark .eyebrow{color:#7fd1c0}.dark .floating-chip{background:#284560;color:#e2eef7;border-color:#4e6a84}.dark .folder.selected,.dark .listbutton.selected{background:#2b4566}.dark .drop{background:#1d3450;border-color:#4d6c8d}.dark .notice{background:#4c4128;color:#f0dbab}.dark .chip,.dark summary,.dark .pill{background:#2b4564;color:#bcd8fd}.dark .empty{border-color:#4c6682}.dark .danger{background:#4b303c;color:#ffbec4}.dark .metric-teal .metric-icon{background:#204e4c;color:#a4e0cf}.dark .metric-purple .metric-icon{background:#483c62;color:#d7bdf8}.dark .metric-blue .metric-icon{background:#284b74;color:#accdf8}.dark .metric-amber .metric-icon{background:#524630;color:#e5c58d}.dark .source-link{color:#a2c9ff}
@media(max-width:1120px){.hero{grid-template-columns:1fr .65fr}.hero h1{font-size:35px}.hero-visual{transform:scale(.8);transform-origin:center}.metric-icon{display:none}}@media(max-width:800px){.hero{grid-template-columns:1fr}.hero-visual{display:none}.hero{min-height:0}.hero h1{font-size:34px}.folder{min-width:150px}.theme-toggle{padding:8px}.metrics .metric{padding:17px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}