:root{color-scheme:dark;--navy:#171326;--teal:#b69aff;--bg:#0b0911;--ink:#f2effa;--muted:#aaa3bc;--line:#30283e;--white:#171321;--surface:#15111e;--surface-strong:#1d1729;--accent:#a78bfa;--accent-bright:#c4b5fd;--success:#8ee6c0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:radial-gradient(ellipse at 50% -20%,#25183d 0,transparent 45%),var(--bg);color:var(--ink);line-height:1.6}
header{background:linear-gradient(115deg,#100d18,#1b1428 62%,#291b40);color:white;padding:20px max(18px,calc((100vw - 1160px)/2));border-bottom:1px solid #413454;box-shadow:0 10px 35px #0005}
.brand{font-size:12px;letter-spacing:.2em;font-weight:850;color:var(--accent-bright)}.site-title{font-size:18px;font-weight:800;margin-top:4px}.nav{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px}.nav a{color:#e8e0f5;text-decoration:none;font-size:13px;font-weight:700;transition:color .18s}.nav a:hover,.nav a:focus-visible{color:var(--accent-bright);text-decoration:underline}
.nav-heading{display:none}.nav a[aria-current=page]{color:var(--accent-bright)}
.menu-toggle,.menu-backdrop{display:none}
.install-prompt{position:fixed;z-index:1100;right:16px;bottom:16px;left:16px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;max-width:760px;margin:0 auto;padding:16px 18px;background:linear-gradient(145deg,#20182f,#14111c);border:1px solid #654f89;border-radius:16px;box-shadow:0 18px 55px #000b;color:var(--ink)}.install-prompt[hidden],.install-help[hidden]{display:none}.install-prompt-copy strong{display:block;color:#f4edff;font-size:15px}.install-prompt-copy span{display:block;color:#c0b6d0;font-size:13px;margin-top:3px}.install-prompt-actions{display:flex;align-items:center;gap:8px}.install-prompt .btn{white-space:nowrap;cursor:pointer}.install-dismiss{border:0;background:transparent;color:#c4b5fd;font:inherit;font-weight:750;padding:10px;cursor:pointer}.install-help{grid-column:1/-1;color:#d7cee5;font-size:13px;line-height:1.5;padding:12px 14px;background:#110e18;border-radius:10px}.install-help strong{color:#eee6ff}.install-help ol{margin:6px 0 0;padding-left:21px}
.hero{background:linear-gradient(135deg,#1c1528,#110e18 74%);border-bottom:1px solid var(--line)}.hero-inner{max-width:1160px;margin:auto;padding:62px 22px 52px}.eyebrow{color:var(--accent-bright);font-size:12px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
h1{font-size:clamp(32px,5.5vw,56px);line-height:1.06;color:#f6f1ff;margin:12px 0 18px;max-width:850px;letter-spacing:-.035em}h2{font-size:26px;line-height:1.2;color:#f3edff;margin:0 0 10px}h3{color:#eee6ff;margin:8px 0;font-size:18px}.lead{font-size:18px;color:#c1b8d2;max-width:800px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:11px 15px;border-radius:10px;font-weight:800;font-size:13px;background:linear-gradient(135deg,#a78bfa,#8b5cf6);color:#100b19;border:1px solid #b69aff;transition:transform .18s,filter .18s,box-shadow .18s}.btn.alt{background:#211a2d;color:#e9dfff;border-color:#49385f}.btn:hover{filter:brightness(1.12);transform:translateY(-1px);box-shadow:0 7px 20px #8b5cf633}
.wrap{max-width:1160px;margin:auto;padding:32px 22px 55px}.section{padding:10px 0 26px;scroll-margin-top:20px}.muted{color:var(--muted)}.small{font-size:12px;color:var(--muted)}.panel{background:linear-gradient(145deg,#191522,#14111b);border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:0 12px 35px #0003}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:18px}.card{background:linear-gradient(145deg,#1b1724,#15121c);border:1px solid var(--line);border-radius:15px;padding:18px;transition:border-color .18s,transform .18s,box-shadow .18s}.card:hover{border-color:#66518c;transform:translateY(-2px);box-shadow:0 12px 25px #0004}.card p{font-size:14px;color:#b4adc1;margin:8px 0 14px}.tag{display:inline-block;background:#2a2140;color:#d2c2ff;border:1px solid #493768;border-radius:999px;padding:5px 10px;font-size:11px;font-weight:850}
.piece-ref{font-size:12px;letter-spacing:.04em;font-weight:850;color:var(--accent-bright)}.piece-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.piece-links a,.piece-links button{font:inherit;font-size:12px;text-decoration:none;font-weight:800;border:1px solid #40364f;border-radius:8px;padding:8px 10px;color:#e3d9f3;background:#211c2b;cursor:pointer}.piece-links a:hover,.piece-links button:hover{border-color:var(--accent);color:#fff}.piece-links a.primary,.piece-links button.primary{background:var(--accent);color:#150e20;border-color:var(--accent)}
.searchrow{display:grid;grid-template-columns:minmax(200px,1fr) minmax(180px,260px);gap:10px;margin:17px 0}input,select,textarea{font:inherit;border:1px solid #43384f;border-radius:9px;background:#15121c;padding:11px 12px;min-width:0;color:var(--ink)}input::placeholder,textarea::placeholder{color:#92899f}input:focus,select:focus,textarea:focus{outline:2px solid #a78bfa;outline-offset:1px;border-color:var(--accent)}select option{background:#171321;color:var(--ink)}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px;background:var(--surface)}table{border-collapse:collapse;width:100%;min-width:760px;font-size:13px}th,td{text-align:left;padding:11px 12px;border-bottom:1px solid #302a3b;vertical-align:top}th{background:#211a2d;color:#e8dcff}tbody tr:hover{background:#211b2a}td a{color:var(--accent-bright);font-weight:800}.count{font-size:13px;color:var(--muted);margin-bottom:8px}
.notice{border-left:4px solid var(--accent);background:#1d1729;color:#d7cee5;padding:13px 16px;border-radius:0 10px 10px 0;font-size:13px;margin-top:16px}
.advanced-search{display:grid;grid-template-columns:minmax(220px,2fr) repeat(3,minmax(150px,1fr));gap:10px;margin:18px 0 12px;padding:16px;background:#14111b;border:1px solid var(--line);border-radius:14px}.advanced-search label{display:grid;gap:6px;color:#c8bfd6;font-size:12px;font-weight:750}.search-status{color:var(--muted);font-size:13px;margin:8px 0}#shopping-items{grid-template-columns:1fr}.list-item{display:grid;grid-template-columns:auto minmax(150px,1fr) auto auto;align-items:center;gap:12px}.list-item label{display:flex;align-items:center;gap:10px;min-width:0}.list-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}.list-item.is-purchased .list-item-name{text-decoration:line-through;color:var(--muted)}.list-item-name{font-weight:800}.list-item-ref{display:block;color:var(--accent-bright);font-size:12px}.quantity-control{display:flex;align-items:center;gap:8px}.quantity-control button,.remove-item{border:1px solid #49385f;border-radius:8px;background:#211a2d;color:#eee6ff;padding:6px 10px;font:inherit;cursor:pointer}.quantity-control button:hover,.remove-item:hover{border-color:var(--accent);color:#fff}.shopping-summary{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0}.empty-state{text-align:center;padding:30px 18px;color:var(--muted)}footer{background:#100d17;border-top:1px solid #30283e;color:#b9b0c8;padding:25px 22px;text-align:center;font-size:12px}footer a{color:var(--accent-bright)}
@media(max-width:880px){.advanced-search{grid-template-columns:1fr 1fr}.list-item{grid-template-columns:minmax(0,1fr) auto}.list-item label{grid-column:1/-1}.list-item .quantity-control{grid-column:1;grid-row:auto}.list-item>.btn{grid-column:2;grid-row:auto;justify-self:end}.list-item .remove-item{grid-column:1/-1;grid-row:auto;justify-self:start}}
@media(max-width:600px){.hero-inner{padding-top:40px}.searchrow,.advanced-search{grid-template-columns:1fr}.wrap{padding-top:24px}.nav{gap:10px}}
@media(max-width:700px){.install-prompt{grid-template-columns:1fr;padding:14px;gap:8px}.install-prompt-actions{display:grid;grid-template-columns:1fr auto}.install-prompt-actions .btn{justify-self:stretch}.install-dismiss{padding:10px 6px}}
@media(min-width:1101px){body{padding-left:260px}.nav{position:fixed;z-index:1000;top:0;left:0;right:auto;bottom:0;width:240px;display:flex;flex-direction:column;align-items:stretch;gap:7px;flex-wrap:nowrap;overflow-y:auto;margin:0;padding:30px 18px;background:linear-gradient(180deg,#171222,#100d17);border-left:0;border-right:1px solid #40334f;box-shadow:12px 0 35px #0003}.nav-heading{display:block;color:var(--accent-bright);font-weight:850;font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:5px 8px 15px;border-bottom:1px solid var(--line);margin-bottom:8px}.nav a{display:block;padding:10px 11px;border-radius:9px}.nav a:hover,.nav a[aria-current=page]{background:#29203a;text-decoration:none}.nav a[aria-current=page]{box-shadow:inset 3px 0 var(--accent)}}
@media(max-width:1100px){.brand,.site-title{max-width:calc(100% - 140px);margin-left:132px}.menu-toggle{position:fixed;z-index:1001;top:12px;left:12px;right:auto;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 12px;border:1px solid #b69aff;border-radius:11px;background:linear-gradient(135deg,#a78bfa,#8b5cf6);color:#140e20;font:inherit;font-size:13px;font-weight:850;box-shadow:0 7px 20px #0005;cursor:pointer}.menu-toggle:focus-visible,.menu-backdrop:focus-visible{outline:3px solid #fff;outline-offset:3px}.menu-icon{position:relative;width:16px;height:12px;border-top:2px solid currentColor;border-bottom:2px solid currentColor}.menu-icon:after{position:absolute;top:3px;left:0;width:100%;border-top:2px solid currentColor;content:""}.nav{position:fixed;z-index:1000;top:0;left:0;right:auto;bottom:0;width:min(84vw,320px);height:100vh;height:100dvh;display:flex;flex-direction:column;align-items:stretch;gap:7px;flex-wrap:nowrap;overflow-y:auto;margin:0;padding:76px 18px 24px;background:linear-gradient(180deg,#1b1528,#100d17);border-left:0;border-right:1px solid #49385f;box-shadow:15px 0 40px #0008;transform:translateX(-105%);visibility:hidden;transition:transform .22s ease,visibility .22s ease}.nav-heading{display:block;color:var(--accent-bright);font-weight:850;font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:5px 8px 15px;border-bottom:1px solid var(--line);margin-bottom:8px}.nav a{display:block;padding:11px;border-radius:9px}.nav a:hover,.nav a[aria-current=page]{background:#29203a;text-decoration:none}.nav a[aria-current=page]{box-shadow:inset 3px 0 var(--accent)}.menu-backdrop{position:fixed;z-index:999;inset:0;display:none;width:100%;height:100%;padding:0;border:0;background:#08060db8;cursor:pointer}body.menu-open{overflow:hidden}body.menu-open .nav{transform:translateX(0);visibility:visible}body.menu-open .menu-backdrop{display:block}body.menu-open .menu-toggle{background:#251b35;color:#f1eaff}}
@media(max-width:600px){.brand,.site-title{margin-left:0}.brand{padding-top:54px}.site-title{font-size:15px;line-height:1.35}.menu-toggle{top:10px;left:10px}}
.nav-group{display:grid;gap:3px}
.nav-group-toggle{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-width:0;padding:11px;border:1px solid transparent;border-radius:9px;background:transparent;color:#e8e0f5;font:inherit;font-size:13px;font-weight:800;text-align:left;cursor:pointer}
.nav-group-toggle:hover,.nav-group-toggle:focus-visible,.nav-group.is-current>.nav-group-toggle{background:#211a2d;border-color:#40334f;color:var(--accent-bright)}
.nav-group-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.nav-chevron{width:8px;height:8px;flex:none;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .18s}
.nav-group-toggle[aria-expanded=true] .nav-chevron{transform:rotate(225deg) translate(-2px,-1px)}
.nav-submenu{display:grid;gap:3px;padding:3px 0 7px 10px}
.nav-submenu[hidden]{display:none}
.nav a.nav-sub-link{padding:8px 10px 8px 13px;color:#c9c0d4;font-size:12px}
.nav a.nav-sub-link[aria-current=page]{color:var(--accent-bright);background:#29203a}
.nav-home{font-weight:800}
@media(min-width:1101px){.nav-group-toggle{font-size:12px}.nav-submenu{border-left:1px solid #40334f;margin-left:8px;padding-left:9px}.nav-group.is-current>.nav-group-toggle{color:var(--accent-bright)}}
