@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700;800&display=swap');
:root{--bg:#f5f5f0;--ink:#20342d;--muted:#81887e;--line:#e2e5dc;--green:#264c3d;--lime:#d4e6ad}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px 'Noto Sans TC',sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}aside{position:fixed;inset:0 auto 0 0;width:218px;background:#eef0e7;border-right:1px solid var(--line);padding:36px 24px}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--green);font-size:36px}.brand span{font-size:25px;font-weight:800}.brand small{display:block;font-size:9px;letter-spacing:2px}.nav-label{font-size:11px;color:var(--muted);margin:64px 12px 18px}.nav{display:block;width:100%;border:0;background:none;text-align:left;padding:14px 12px;color:#6d786e;border-radius:6px;margin-bottom:8px}.nav.active{background:var(--green);color:white}.aside-bottom{position:absolute;bottom:30px;font-size:12px}.aside-bottom small{display:block;color:var(--muted);font-size:10px;line-height:1.9;margin-top:12px}.dot{display:inline-block;width:6px;height:6px;background:#77a36b;border-radius:50%;margin-right:7px}main{margin-left:218px;padding:0 42px;max-width:1800px}header{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:12px}header>div{display:flex;gap:15px;align-items:center}header b{font-weight:500;color:#425749}.quiet{border:0;background:none;color:#667565;padding:8px}.avatar{background:#e4e8d9;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;color:var(--green)}.intro{display:flex;align-items:center;justify-content:space-between;padding:42px 0 30px}.eyebrow{font-size:9px;letter-spacing:2.5px;color:#7a8a70}h1{font-size:30px;letter-spacing:1px;margin:12px 0}p{color:var(--muted);font-size:12px}.primary{border:0;background:var(--green);color:white;padding:13px 22px;border-radius:5px;box-shadow:0 4px 8px #264c3d12}.primary:hover{background:#37644f}.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:#fffefa;border-radius:8px;padding:24px 0}.stats article{padding:0 26px;border-right:1px solid var(--line)}.stats article:last-child{border:0}label{font-size:12px}article label{color:#738070;display:block}article label span{float:right;font-size:9px;border:1px solid var(--line);padding:2px 5px;border-radius:3px}strong{display:block;font-size:29px;font-weight:600;margin:12px 0 8px;letter-spacing:-1px}article small{font-size:10px;color:#929b8c}em{font-size:12px;font-style:normal;color:var(--muted)}.positive{color:#478354}.negative{color:#b35a4e}.collection{margin-top:38px}.section-head{display:flex;justify-content:space-between;align-items:center}h2{font-size:17px;margin:0}.section-head h2 span{font-size:10px;padding:3px 7px;background:#e6eadc;color:#7b8d70;border-radius:4px;margin-left:8px}.view-label{font-size:11px;color:#6b7d64}.toolbar{display:flex;gap:10px;margin:20px 0}.search{background:#fffefa;border:1px solid var(--line);border-radius:5px;display:flex;align-items:center;padding:0 13px;flex:1;max-width:400px;font-size:24px;color:#809075}.search input{width:100%;border:0;background:none;outline:none;font-size:12px;padding:12px}select{border:1px solid var(--line);background:#fffefa;border-radius:5px;color:#61725e;padding:10px;font-size:12px}.toolbar select:last-child{margin-left:auto}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.card{border:1px solid var(--line);background:#fffefa;border-radius:8px;overflow:hidden;cursor:pointer;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-3px);box-shadow:0 10px 25px #20342d12}.art{height:220px;background:#e9ece1;display:flex;align-items:center;justify-content:center;padding:20px;position:relative}.art img{width:100%;height:100%;object-fit:contain}.placeholder-card{width:116px;height:170px;border:1px solid #a9b9a0;border-radius:6px;transform:rotate(-7deg);display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#f3f4df,#d5e0cd);box-shadow:7px 8px 0 #c4d0bc55;color:#526b4c}.placeholder-card span{font-size:32px;margin:12px}.placeholder-card small{font-size:8px;letter-spacing:2px}.sport-tag{position:absolute;left:12px;top:12px;font-size:9px;background:#ffffffe0;padding:4px 7px;border-radius:3px}.card-body{padding:16px}.card h3{font-size:15px;margin:0 0 6px}.sub{font-size:10px;color:var(--muted);height:31px;line-height:1.6}.grade{display:inline-block;font-size:9px;border:1px solid #d9dfcf;border-radius:3px;padding:3px 6px;margin:10px 0}.price-row{border-top:1px solid var(--line);padding-top:12px;display:flex;justify-content:space-between;align-items:center}.price-row b{font-size:17px}.price-row small{font-size:9px;color:var(--muted);display:block;margin-bottom:4px}.change{font-size:10px}.empty{grid-column:1/-1;text-align:center;padding:54px 20px;border:1px dashed #cfd7c5;border-radius:8px;background:#f0f2e9}.empty .symbol{font-size:40px;color:#829676}.empty h3{font-size:17px}.empty p{line-height:1.8}.empty button{margin-top:12px}footer{display:flex;justify-content:space-between;color:#9aa28f;font-size:9px;letter-spacing:1px;border-top:1px solid var(--line);padding:24px 0;margin-top:48px}dialog{border:1px solid var(--line);border-radius:12px;width:590px;max-width:95vw;padding:26px;color:var(--ink);max-height:90vh}dialog::backdrop{background:#132c2466;backdrop-filter:blur(3px)}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}.fields label{display:flex;flex-direction:column;gap:7px;color:#6b7867}.fields input,.fields textarea{border:1px solid var(--line);border-radius:5px;padding:10px;width:100%;background:#fafbf7}.wide{grid-column:1/-1}.fields small{font-size:10px}.modal-foot{display:flex;justify-content:flex-end;gap:12px;margin-top:22px}.danger{margin-right:auto;background:none;border:0;color:#ad665b}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--green);color:white;padding:12px 24px;border-radius:7px;display:none;z-index:10}@media(min-width:1500px){.art{height:290px}}@media(max-width:1150px){.grid{grid-template-columns:repeat(3,1fr)}main{padding:0 24px}.stats article{padding:0 16px}strong{font-size:25px}}@media(max-width:850px){aside{width:165px;padding:25px 15px}main{margin-left:165px}.grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:1fr 1fr;gap:25px}.stats article:nth-child(2){border:0}.intro h1{font-size:23px}}@media(max-width:600px){aside{position:static;width:100%;display:flex;align-items:center;justify-content:space-between;padding:15px}.brand{font-size:25px}.brand span{font-size:20px}.nav{width:auto;margin:0;padding:10px}.nav-label,.aside-bottom{display:none}main{margin:0;padding:0 18px}header{height:65px}header>span{display:none}header>div{width:100%;justify-content:flex-end}.intro{padding:28px 0;align-items:flex-start;gap:10px}.intro h1{font-size:21px}.intro p{font-size:10px}.intro .primary{padding:11px 12px;white-space:nowrap;font-size:11px}.eyebrow{font-size:7px}.stats article{padding:0 15px}.stats strong{font-size:24px}.toolbar{flex-wrap:wrap}.search{flex-basis:100%;max-width:100%}.toolbar select{flex:1}.grid{gap:12px}.art{height:185px;padding:12px}.card-body{padding:12px}.card h3{font-size:13px}.price-row{align-items:flex-start;gap:4px}.price-row b{font-size:15px}.change{font-size:8px}.fields{gap:12px}dialog{padding:20px}}