:root{--bg-cream: #fdf8ec;--card-glass: rgba(253, 248, 236, .72);--card-border: rgba(90, 122, 74, .35);--moss: #5a7a4a;--moss-deep: #1a3c2a;--moss-mid: #2d5a3d;--moss-hi: #7dbf8a;--sage: #a8bba0;--oak: #c4a882;--pixel-red: #d64550;--warm-orange: #e8a87c;--honey: #f0d58c;--ink: #3d2c1b;--ink-soft: #6b5640;--cream-text: #fdf8ec;--px: 4px;--radius: 14px;--shadow-soft: 0 6px 18px rgba(58, 44, 27, .12);--shadow-deep: 0 10px 28px rgba(26, 60, 42, .22);--nav-w: 200px;--nav-w-collapsed: 72px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:-apple-system,PingFang SC,Microsoft YaHei,Segoe UI,system-ui,sans-serif;color:var(--ink);background-color:var(--bg-cream);background-image:radial-gradient(circle at 12% 18%,rgba(168,187,160,.18) 0 6px,transparent 7px),radial-gradient(circle at 78% 8%,rgba(196,168,130,.16) 0 5px,transparent 6px),radial-gradient(circle at 40% 88%,rgba(125,191,138,.15) 0 6px,transparent 7px);background-attachment:fixed;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased}.glass-card{background:var(--card-glass);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:2px solid var(--card-border);border-radius:var(--radius);box-shadow:var(--shadow-soft);padding:16px;position:relative}.glass-card:after{content:"";position:absolute;right:12px;bottom:10px;width:10px;height:10px;background:radial-gradient(circle,var(--oak) 1px,transparent 1.5px) 0 0 / 5px 5px,radial-gradient(circle,var(--moss-hi) 1px,transparent 1.5px) 2.5px 2.5px / 5px 5px;opacity:.6;pointer-events:none}.px-btn{border:var(--px) solid var(--moss-deep);background:var(--moss);color:var(--cream-text);font-weight:700;padding:10px 16px;border-radius:6px;cursor:pointer;box-shadow:0 3px 0 var(--moss-deep);transition:transform .06s ease,box-shadow .06s ease;font-size:14px}.px-btn:active{transform:translateY(3px);box-shadow:0 0 0 var(--moss-deep)}.px-btn.ghost{background:transparent;color:var(--moss-deep);border-color:var(--moss);box-shadow:0 3px 0 var(--moss)}.px-btn.danger{background:var(--pixel-red);border-color:#8f2b32;box-shadow:0 3px #8f2b32}.px-btn.small{padding:6px 10px;font-size:12px}.px-tag{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;padding:3px 8px;border-radius:4px;border:2px solid var(--moss-deep);background:var(--honey);color:var(--ink)}.px-tag.red{background:var(--pixel-red);color:#fff;border-color:#8f2b32}.px-tag.sage{background:var(--sage)}.px-tag.oak{background:var(--oak)}h1,h2,h3{color:var(--moss-deep);margin:0 0 10px}.muted{color:var(--ink-soft);font-size:13px}.row{display:flex;gap:10px;align-items:center}.col{display:flex;flex-direction:column;gap:10px}.spread{justify-content:space-between}.wrap{flex-wrap:wrap}input,select,textarea{font-family:inherit;font-size:14px;color:var(--ink);background:#fff9;border:2px solid var(--sage);border-radius:8px;padding:9px 11px;outline:none;width:100%}input:focus,select:focus,textarea:focus{border-color:var(--moss)}label{font-size:13px;font-weight:600;color:var(--ink-soft);display:block;margin-bottom:4px}.empty-state{text-align:center;color:var(--ink-soft);padding:40px 20px;border:2px dashed var(--sage);border-radius:var(--radius);margin-top:16px}.ring-wrap{display:inline-flex;align-items:center;justify-content:center;position:relative}.ring-label{position:absolute;font-weight:800;color:var(--moss-deep)}@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.08)}to{transform:scale(1);opacity:1}}.pop-in{animation:pop .3s ease both}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.floaty{animation:floaty 3s ease-in-out infinite}