:root{--blue:#1463ff;--blue2:#0b47c9;--ink:#14213d;--muted:#6b7894;--bg:#f5f8fc;--card:#fff;--line:#e6ebf3;--green:#12a66a;--red:#e5484d}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);margin:0;padding:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.app{min-height:100vh;display:flex}.sidebar{border-right:1px solid var(--line);background:#fff;width:255px;padding:22px 16px;position:fixed;inset:0 auto 0 0}.brand{align-items:center;gap:10px;padding:8px 10px 26px;font-size:20px;font-weight:800;display:flex}.q{background:linear-gradient(135deg,var(--blue),#58a0ff);color:#fff;border-radius:11px;place-items:center;width:36px;height:36px;font-weight:900;display:grid}.nav{gap:5px;display:grid}.nav a{color:#526079;border-radius:11px;padding:12px 13px;font-weight:650}.nav a:hover,.nav a.active{color:var(--blue);background:#edf4ff}.main{width:calc(100% - 255px);margin-left:255px}.top{border-bottom:1px solid var(--line);z-index:5;background:#fff;justify-content:space-between;align-items:center;height:70px;padding:0 30px;display:flex;position:sticky;top:0}.top small{color:var(--muted)}.content{max-width:1300px;margin:auto;padding:30px}.h1{margin:0 0 7px;font-size:28px;font-weight:850}.sub{color:var(--muted);margin:0 0 24px}.grid4{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.grid3{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.card{background:var(--card);border:1px solid var(--line);border-radius:17px;padding:20px;box-shadow:0 5px 20px #1b355e0a}.stat b{margin-top:8px;font-size:28px;display:block}.label{color:var(--muted);font-size:13px;font-weight:700}.pill{border-radius:99px;padding:5px 9px;font-size:12px;font-weight:800;display:inline-flex}.green{color:var(--green);background:#e8faf2}.yellow{color:#a86a00;background:#fff7df}.bluepill{color:var(--blue);background:#edf4ff}.red{color:var(--red);background:#ffebed}.btn{cursor:pointer;border:0;border-radius:11px;justify-content:center;align-items:center;gap:7px;padding:11px 15px;font-weight:800;display:inline-flex}.primary{background:var(--blue);color:#fff}.primary:hover{background:var(--blue2)}.ghost{color:#32415d;background:#f1f5fa}.danger{color:var(--red);background:#fff0f1}.actions{flex-wrap:wrap;gap:9px;display:flex}.table{border-collapse:collapse;width:100%}.table th,.table td{text-align:left;border-bottom:1px solid var(--line);padding:14px 10px;font-size:14px}.table th{text-transform:uppercase;color:var(--muted);font-size:12px}.product{align-items:center;gap:14px;display:flex}.thumb{width:56px;height:56px;color:var(--blue);background:linear-gradient(135deg,#dceaff,#f3f7ff);border-radius:13px;place-items:center;font-weight:900;display:grid}.loginWrap{background:linear-gradient(135deg,#f4f8ff,#fff);place-items:center;min-height:100vh;padding:20px;display:grid}.loginBox{border:1px solid var(--line);background:#fff;border-radius:22px;width:min(430px,100%);padding:30px;box-shadow:0 18px 60px #23416e1a}.input{border:1px solid #dce3ee;border-radius:11px;outline:none;width:100%;padding:13px 14px}.input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #e8f1ff}.field{gap:7px;margin:14px 0;display:grid}.field label{font-size:13px;font-weight:750}.checkout{background:#f7f9fc;min-height:100vh}.checkoutHead{border-bottom:1px solid var(--line);background:#fff;padding:17px 24px}.checkoutWrap{grid-template-columns:1.1fr .9fr;gap:22px;max-width:1050px;margin:30px auto;padding:0 18px;display:grid}.heroProduct{min-height:230px;color:var(--blue);background:linear-gradient(135deg,#e8f2ff,#f8fbff);border-radius:18px;place-items:center;font-size:40px;font-weight:900;display:grid}.formGrid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.span2{grid-column:span 2}.note{color:#56647d;background:#f2f6fb;border-radius:12px;padding:12px;font-size:13px}.empty{text-align:center;color:var(--muted);padding:50px 20px}@media (max-width:900px){.sidebar{width:82px;padding:15px 9px}.brand span,.nav a span:nth-child(2){display:none}.brand{justify-content:center;padding:8px 0 24px}.nav a{place-items:center;padding:12px 8px;display:grid}.nav a span:first-child{font-size:20px;line-height:1;display:block}.main{width:calc(100% - 82px);margin-left:82px}.grid4{grid-template-columns:repeat(2,1fr)}.grid3,.checkoutWrap{grid-template-columns:1fr}.content{padding:20px}.formGrid{grid-template-columns:1fr}.span2{grid-column:auto}}@media (max-width:700px){.sidebar{border-right:1px solid var(--line);z-index:30;background:#fff;border-top:0;width:76px;height:100vh;padding:12px 7px;position:fixed;inset:0 auto 0 0;box-shadow:4px 0 24px #1b355e0f}.brand{padding:7px 0 22px;display:flex}.brand .q{border-radius:12px;width:38px;height:38px}.nav{gap:5px;display:grid;overflow:visible}.nav a{border-radius:12px;place-items:center;gap:0;width:100%;min-width:0;padding:11px 5px;font-size:10px;line-height:1;display:grid}.nav a span{display:none}.nav a span:first-child{font-size:19px;line-height:20px;display:block}.nav a:hover,.nav a.active{color:var(--blue);background:#edf4ff}.main{width:calc(100% - 76px);min-width:0;margin-left:76px;padding-bottom:0}.top{height:58px;padding:0 14px;position:sticky;top:0}.top b{font-size:14px}.top small{font-size:11px}.content{padding:16px 13px}.h1{font-size:24px;line-height:1.15}.sub{margin-bottom:18px;font-size:13px;line-height:1.45}.grid4{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.grid3{gap:12px}.card{border-radius:15px;min-width:0;padding:15px}.stat b{word-break:break-word;font-size:22px}.label{font-size:11px}.tableWrap,.tableCard{-webkit-overflow-scrolling:touch;width:100%;overflow-x:auto}.table{min-width:680px}.actions{gap:7px}.btn{padding:10px 12px;font-size:13px}.product{min-width:180px}}@media (max-width:420px){.sidebar{width:68px;padding-left:6px;padding-right:6px}.main{width:calc(100% - 68px);margin-left:68px}.content{padding:14px 10px}.card{padding:13px}.stat b{font-size:20px}.top{padding:0 11px}.top small{display:none}.nav a{padding:10px 4px}.brand .q{width:36px;height:36px}}.memberApp{min-height:100vh;color:var(--ink);background:linear-gradient(#f7faff 0%,#f5f8fc 55%,#fff 100%)}.memberMain{min-height:100vh;padding-bottom:86px}.memberTop{z-index:20;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffe0;border-bottom:1px solid #e6ebf3e6;justify-content:space-between;align-items:center;height:68px;padding:0 22px;display:flex;position:sticky;top:0}.memberLogo{color:var(--blue);align-items:center;gap:9px;display:flex}.memberLogo .q{border-radius:10px;width:34px;height:34px}.memberLogo div:last-child{flex-direction:column;line-height:.9;display:flex}.memberLogo b{letter-spacing:.5px;font-size:17px}.memberLogo span{letter-spacing:3px;margin-top:4px;font-size:9px;font-weight:800}.memberTopRight{align-items:center;gap:11px;display:flex}.bell{font-size:23px;display:inline-block;transform:rotate(180deg)}.avatarMini{width:35px;height:35px;color:var(--blue);background:#dceaff;border-radius:50%;place-items:center;font-weight:900;display:grid}.memberContent{width:min(760px,100%);margin:auto;padding:22px 18px 28px}.memberWelcome{background:linear-gradient(135deg,#eaf3ff,#fff);border:1px solid #dfeaf8;border-radius:24px;justify-content:space-between;align-items:center;min-height:172px;padding:24px 22px;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 32px #1b48870f}.eyebrow{letter-spacing:1.8px;color:var(--blue);margin-bottom:7px;font-size:11px;font-weight:850}.memberWelcome h1,.accountIntro h1{letter-spacing:-.7px;margin:0 0 7px;font-size:30px;line-height:1.1}.memberWelcome p,.accountIntro p{color:var(--muted);margin:0;font-size:14px}.welcomeArt{flex:none;width:190px;height:140px;position:relative}.welcomeArt span{color:#fff;background:linear-gradient(145deg,#2d73e9,#dceaff);border-radius:35px;place-items:center;width:105px;height:105px;font-size:64px;font-weight:950;display:grid;position:absolute;bottom:8px;right:38px;transform:rotate(5deg);box-shadow:0 15px 30px #1463ff2e}.welcomeArt i{color:#1463ff;font-size:26px;font-style:normal;position:absolute;top:20px;right:19px}.welcomeArt em{color:#53647f;font-size:12px;font-style:normal;font-weight:700;line-height:1.4;position:absolute;top:22px;left:0;transform:rotate(-3deg)}.memberSection{margin-top:26px}.sectionHead{justify-content:space-between;align-items:end;margin-bottom:13px;display:flex}.sectionHead h2{margin:0 0 4px;font-size:22px}.sectionHead p{color:var(--muted);margin:0;font-size:13px}.productCount{color:var(--blue);background:#edf4ff;border-radius:99px;padding:7px 10px;font-size:12px;font-weight:800}.memberProducts{gap:13px;display:grid}.memberCard,.memberProductCard,.memberEmpty{border:1px solid var(--line);background:#fff;border-radius:20px;box-shadow:0 7px 24px #1b355e0b}.memberProductCard{grid-template-columns:96px 1fr;align-items:center;gap:15px;padding:14px;display:grid}.productVisual{background:#eaf2ff;border-radius:16px;width:96px;height:96px;overflow:hidden}.productVisual img{object-fit:cover;width:100%;height:100%;display:block}.productPlaceholder{width:100%;height:100%;color:var(--blue);background:linear-gradient(135deg,#dceaff,#f5f9ff);place-items:center;font-size:40px;font-weight:950;display:grid}.productInfo h3{margin:7px 0 4px;font-size:18px}.productInfo p{color:var(--muted);margin:0;font-size:12px;line-height:1.45}.statusRow .pill{padding:5px 8px;font-size:10px}.productBtn{grid-column:1/-1;width:100%;min-height:44px}.memberEmpty{text-align:center;padding:34px 20px}.emptyIcon{width:52px;height:52px;color:var(--blue);background:#edf4ff;border-radius:16px;place-items:center;margin:auto;font-size:23px;display:grid}.memberEmpty h3{margin:13px 0 5px}.memberEmpty p{color:var(--muted);max-width:340px;margin:0 auto 17px;font-size:13px;line-height:1.5}.memberPromo{background:#eef6ff;border:1px solid #dceaff;border-radius:18px;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;margin-top:20px;padding:16px;display:grid}.promoIcon{width:42px;height:42px;color:var(--blue);background:#fff;border-radius:13px;place-items:center;font-size:20px;display:grid}.memberPromo h3{margin:0 0 3px;font-size:14px}.memberPromo p{color:var(--muted);margin:0;font-size:12px}.memberPromo a{color:var(--blue);font-size:12px;font-weight:850}.memberFooter{text-align:center;color:#9aa7ba;padding:26px 0 4px;font-size:10px}.memberFooter span{margin:0 5px}.memberNav{border:1px solid var(--line);z-index:50;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffffff5;border-radius:22px;grid-template-columns:repeat(3,1fr);width:min(390px,100% - 24px);height:66px;padding:5px;display:grid;position:fixed;bottom:12px;left:50%;transform:translate(-50%);box-shadow:0 12px 38px #19365f26}.memberNavItem{color:#8190a8;border-radius:17px;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:10px;font-weight:750;display:flex}.memberNavItem.active{color:var(--blue);background:#edf4ff}.memberNavIcon{font-size:20px;line-height:1}.accountPage{padding-top:26px}.accountIntro{margin-bottom:18px}.accountIdentity{border:1px solid var(--line);background:#fff;border-radius:20px;align-items:center;gap:14px;padding:18px;display:flex;box-shadow:0 7px 24px #1b355e0b}.avatarLarge{color:#fff;background:linear-gradient(145deg,#2d73e9,#dceaff);border-radius:18px;place-items:center;width:58px;height:58px;font-size:25px;font-weight:900;display:grid}.accountIdentity h2{margin:0 0 3px;font-size:18px}.accountIdentity p{color:var(--muted);word-break:break-all;margin:0;font-size:12px}.accountMenu{border:1px solid var(--line);background:#fff;border-radius:20px;margin-top:14px;overflow:hidden}.accountMenu>div{border-bottom:1px solid var(--line);grid-template-columns:32px 1fr 20px;align-items:center;gap:10px;padding:16px;display:grid}.accountMenu>div:last-child{border-bottom:0}.accountMenu>div>span{color:var(--blue);text-align:center;font-size:20px}.accountMenu b{font-size:13px;display:block}.accountMenu small{color:var(--muted);margin-top:3px;font-size:11px;display:block}.accountMenu strong{color:#9aa7ba;font-size:24px;font-weight:400}.logoutBtn{width:100%;min-height:46px;margin-top:14px}@media (max-width:600px){.memberTop{padding:0 15px}.memberContent{padding:16px 12px 20px}.memberWelcome{border-radius:20px;min-height:155px;padding:20px 17px}.memberWelcome h1,.accountIntro h1{font-size:25px}.welcomeArt{width:130px;height:110px}.welcomeArt span{border-radius:25px;width:78px;height:78px;font-size:47px;bottom:6px;right:6px}.welcomeArt em{font-size:9px;top:15px;left:0}.welcomeArt i{font-size:20px;top:7px;right:0}.sectionHead h2{font-size:20px}.memberProductCard{grid-template-columns:76px 1fr;gap:12px;padding:12px}.productVisual{border-radius:13px;width:76px;height:76px}.productInfo h3{font-size:16px}.productInfo p{font-size:11px}.memberPromo{grid-template-columns:36px 1fr;gap:10px}.memberPromo a{grid-column:2}.promoIcon{width:36px;height:36px}.memberFooter{padding-bottom:0}}.memberWelcome{min-height:230px;align-items:stretch!important;padding:22px 22px 18px!important}.welcomeCopy{z-index:2;flex-direction:column;justify-content:center;max-width:55%;display:flex;position:relative}.welcomeCopy h1{font-size:31px!important}.welcomeQuote{border-left:3px solid var(--blue);color:#53647f;background:#ffffffb8;border-radius:0 12px 12px 0;max-width:285px;margin-top:16px;padding:10px 13px;font-size:12px;line-height:1.45}.welcomeCharacter{z-index:1;width:245px;height:245px;position:absolute;bottom:-9px;right:8px}.welcomeCharacter img{object-fit:contain;width:100%;height:100%;display:block}.characterBadge{color:#174da8;background:#fff;border:1px solid #dceaff;border-radius:12px;padding:7px 9px;font-size:10px;font-weight:850;position:absolute;top:18px;right:4px;transform:rotate(3deg);box-shadow:0 7px 18px #1b488714}.memberHint{background:#eaf4ff;border:1px solid #dceaff;border-radius:17px;align-items:center;gap:11px;margin-top:14px;padding:13px 15px;display:flex}.memberHint>span{background:#fff;border-radius:12px;place-items:center;width:38px;height:38px;font-size:19px;display:grid}.memberHint b{font-size:13px;display:block}.memberHint small{color:var(--muted);margin-top:2px;font-size:11px;display:block}.accountHelp{background:linear-gradient(135deg,#edf6ff,#f9fcff);border:1px solid #dceaff;border-radius:20px;justify-content:space-between;align-items:center;min-height:130px;margin-top:15px;padding:17px 15px 8px 18px;display:flex;overflow:hidden}.accountHelp b{font-size:16px}.accountHelp p{color:var(--muted);margin:4px 0 8px;font-size:11px}.accountHelp a{color:var(--blue);font-size:11px;font-weight:850}.accountHelp img{object-fit:contain;align-self:flex-end;width:140px;height:140px;margin-bottom:-15px;margin-right:-10px}@media (max-width:600px){.memberWelcome{min-height:250px!important;padding:20px 18px 15px!important}.welcomeCopy{justify-content:flex-start;max-width:68%;padding-top:4px}.welcomeCopy h1{font-size:28px!important}.welcomeQuote{max-width:215px;margin-top:12px;font-size:11px}.welcomeCharacter{width:210px;height:210px;bottom:-5px;right:-2px}.characterBadge{font-size:9px;top:8px;right:7px}.memberHint{margin-top:12px}.memberHint b{font-size:12px}.memberHint small{font-size:10px}.accountHelp img{width:125px;height:125px}}@media (max-width:420px){.memberWelcome{min-height:235px!important}.welcomeCopy{max-width:67%}.welcomeCopy h1{font-size:25px!important}.welcomeCopy p{font-size:13px!important}.welcomeQuote{max-width:180px;padding:8px 10px;font-size:10px}.welcomeCharacter{width:184px;height:184px;bottom:-3px;right:-3px}.characterBadge{padding:6px 7px;font-size:8px}.memberHint{padding:11px 12px}.accountHelp{min-height:120px}.accountHelp img{width:115px;height:115px}}.memberWelcome{color:#fff!important;background:linear-gradient(135deg,#2f7df4 0%,#4f96f5 48%,#8fc3fb 100%)!important;border-color:#7fb4f5!important;box-shadow:0 12px 34px #2568ce24!important}.memberWelcome .eyebrow{color:#ffffffdb!important}.memberWelcome h1{color:#fff!important}.memberWelcome p{color:#ffffffe6!important}.memberWelcome .welcomeQuote{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fffffff0!important;background:#ffffff1f!important;border-left-color:#ffffffd9!important}.welcomeMark{background:linear-gradient(145deg,#ffffff40,#ffffff14);border:1px solid #ffffff3d;border-radius:34px;place-items:center;width:118px;height:118px;display:grid;position:absolute;bottom:18px;right:22px;transform:rotate(7deg);box-shadow:0 16px 34px #10459b1f}.welcomeMark span{color:#ffffffeb;font-size:72px;font-weight:950;transform:rotate(-7deg)}.welcomeMark i{color:#fff;font-size:24px;font-style:normal;position:absolute;top:-10px;right:-4px}@media (max-width:600px){.welcomeMark{border-radius:27px;width:92px;height:92px;bottom:14px;right:14px}.welcomeMark span{font-size:55px}}@media (max-width:420px){.welcomeMark{border-radius:23px;width:76px;height:76px;bottom:12px;right:10px}.welcomeMark span{font-size:45px}.welcomeMark i{font-size:18px;top:-8px;right:-3px}}.welcomeCharacter,.characterBadge{display:none!important}