/* ── 蝦拚商城 樣式（自適應，行動優先）────────────────────── */
:root{
  --primary:#117a65; --primary-dark:#0b5345; --accent:#e76f51; --gold:#f2c94c;
  --bg:#f5f7f8; --card:#fff; --text:#1f2933; --muted:#7b8794; --line:#e6eaee;
  --ok:#1f9d7a; --radius:8px; --shadow:0 2px 12px rgba(20,36,50,.08);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang TC","Microsoft JhengHei",sans-serif;
  background:var(--bg);color:var(--text);line-height:1.5;font-size:15px}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:1200px;margin:0 auto;padding:0 14px}
.page{padding:18px 14px 40px;min-height:50vh}

/* 按鈕 */
.btn{display:inline-block;padding:9px 18px;border-radius:6px;border:none;cursor:pointer;font-size:.92rem;
  font-weight:600;background:#eee;color:#333;transition:.15s;text-align:center}
.btn:hover{filter:brightness(.96)}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-dark)}
.btn-outline{background:#fff;color:var(--primary);border:1px solid var(--primary)}
.btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.7)}
.btn-lg{padding:12px 28px;font-size:1rem}
.btn-block{display:block;width:100%}
.btn-google{background:#fff;border:1px solid #ddd;color:#444;margin-top:10px}
.btn-google span{display:inline-block;width:20px;height:20px;line-height:20px;border-radius:50%;
  background:#4285f4;color:#fff;font-weight:700;margin-right:6px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.link-del{background:none;border:none;color:#e23;cursor:pointer;font-size:.86rem;padding:0}

/* ── Header ── */
.site-header{background:var(--primary);color:#fff;position:sticky;top:0;z-index:50}
.topbar{background:rgba(0,0,0,.06);font-size:.78rem}
.topbar-inner{display:flex;justify-content:flex-end;padding:5px 14px}
.topbar-links a,.topbar-links span{color:#fff;margin-left:14px;opacity:.92}
.topbar-links a:hover{opacity:1;text-decoration:underline}
.header-main{display:flex;align-items:center;gap:18px;padding:12px 14px}
.logo{font-size:1.5rem;font-weight:800;color:#fff;white-space:nowrap}
.search{flex:1;display:flex;background:#fff;border-radius:4px;overflow:hidden;max-width:680px}
.search input{flex:1;border:none;padding:10px 12px;font-size:.92rem;outline:none}
.search button{border:none;background:var(--primary-dark);color:#fff;padding:0 20px;cursor:pointer;font-weight:600}
.cart-btn{position:relative;color:#fff;display:inline-flex;align-items:center;justify-content:center}
.cart-icon{font-size:.78rem;font-weight:800;border:1px solid rgba(255,255,255,.75);border-radius:999px;padding:6px 10px}
.cart-badge{position:absolute;top:-6px;right:-10px;background:#fff;color:var(--primary);font-size:.7rem;
  font-weight:700;border-radius:10px;padding:0 6px;min-width:18px;text-align:center}
.catnav{background:var(--primary-dark);overflow-x:auto}
.catnav::-webkit-scrollbar{display:none}
.catnav{scrollbar-width:none}
.catnav-inner{display:flex;gap:18px;padding:8px 14px;white-space:nowrap}
.catnav a{color:#fff;font-size:.86rem;opacity:.9}
.catnav a:hover{opacity:1}

/* Flash */
.flash{padding:11px 16px;border-radius:8px;margin-bottom:14px;font-size:.9rem;font-weight:500}
.flash.ok{background:#e7f8f3;color:#0c6b5b;border:1px solid #9ee0d1}
.flash.err{background:#fdeaea;color:#a31515;border:1px solid #f4b5b5}

/* Hero */
.hero{background:linear-gradient(120deg,var(--primary),#1b998b 58%,var(--accent));border-radius:12px;
  color:#fff;padding:46px 32px;margin-bottom:20px}
.hero h1{font-size:1.9rem;margin-bottom:10px}
.hero p{opacity:.95;margin-bottom:18px}
.hero .btn{margin-right:10px}
.hero-learning{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:end;min-height:340px}
.eyebrow{text-transform:uppercase;letter-spacing:0;font-size:.78rem;font-weight:800;opacity:.85}
.hero-panel{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);border-radius:10px;padding:18px;display:grid;gap:12px}
.hero-panel div{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:10px}
.hero-panel div:last-child{border-bottom:0;padding-bottom:0}.hero-panel b{font-size:2rem}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}

.cat-strip{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.cat-chip{background:#fff;border-radius:20px;padding:8px 18px;font-size:.88rem;box-shadow:var(--shadow)}
.cat-chip:hover{color:var(--primary)}

/* 區塊 */
.block{margin-bottom:30px}
.block-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;
  border-left:4px solid var(--primary);padding-left:10px}
.block-head h2{font-size:1.2rem}
.block-head a{font-size:.85rem;color:var(--primary)}
.page-title{font-size:1.4rem;margin-bottom:18px}

/* 商品格 */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.pcard{background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.15s;display:block}
.pcard:hover{transform:translateY(-3px);box-shadow:0 6px 18px rgba(0,0,0,.12)}
.pcard-img{padding-top:100%;background-size:cover;background-position:center;position:relative;background-color:#f0f0f0}
.pcard-tag{position:absolute;top:8px;left:8px;background:#7c3aed;color:#fff;font-size:.7rem;padding:2px 8px;border-radius:4px}
.pcard-sale{position:absolute;top:8px;right:8px;background:#ffd400;color:#a35200;font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:4px}
.pcard-body{padding:9px 10px}
.pcard-title{font-size:.86rem;line-height:1.35;height:2.7em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pcard-sub{font-size:.76rem;color:var(--muted);height:2.6em;overflow:hidden;margin-top:5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pcard-price{color:var(--primary);font-weight:700;margin-top:6px}
.pcard-price del{color:var(--muted);font-weight:400;font-size:.78rem;margin-left:4px}
.pcard-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:.74rem;margin-top:5px}
.rate{color:#ffa800}

/* 列表頁 */
.listing{display:grid;grid-template-columns:200px 1fr;gap:18px}
.filters{background:#fff;border-radius:var(--radius);padding:14px;box-shadow:var(--shadow);align-self:start}
.filters h3{font-size:.95rem;margin-bottom:10px}
.filters a{display:block;padding:7px 8px;border-radius:6px;font-size:.86rem;color:#555}
.filters a:hover,.filters a.on{background:#fff0eb;color:var(--primary);font-weight:600}
.listing-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.listing-head h1{font-size:1.2rem}.listing-head small{color:var(--muted);font-weight:400;font-size:.82rem}
.sortbar{display:flex;gap:6px;flex-wrap:wrap}
.sortbar a{padding:5px 12px;border-radius:6px;background:#fff;font-size:.82rem;box-shadow:var(--shadow)}
.sortbar a.on{background:var(--primary);color:#fff}
.pager{display:flex;gap:6px;justify-content:center;margin-top:24px;flex-wrap:wrap}
.pager a{padding:7px 13px;border-radius:6px;background:#fff;box-shadow:var(--shadow)}
.pager a.on{background:var(--primary);color:#fff}

/* 商品詳情 */
.crumb{font-size:.82rem;color:var(--muted);margin-bottom:14px}
.crumb a:hover{color:var(--primary)}
.product-top{display:grid;grid-template-columns:420px 1fr;gap:26px;background:#fff;border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);margin-bottom:20px}
.gallery-main{padding-top:90%;background-size:cover;background-position:center;border-radius:8px;background-color:#f0f0f0}
.gallery-thumbs{display:flex;gap:8px;margin-top:10px}
.gallery-thumbs span{width:56px;height:56px;background-size:cover;background-position:center;border-radius:6px;border:1px solid var(--line)}
.product-info h1{font-size:1.4rem;margin:8px 0}
.tag-course{display:inline-block;background:#7c3aed;color:#fff;font-size:.74rem;padding:2px 10px;border-radius:4px}
.pi-meta{display:flex;gap:16px;color:var(--muted);font-size:.84rem;margin:6px 0 14px;flex-wrap:wrap}
.pi-price{background:#fafafa;padding:16px;border-radius:8px;font-size:1.9rem;font-weight:800;color:var(--primary)}
.pi-price del{font-size:1rem;color:var(--muted);font-weight:400;margin-left:10px}
.pi-shop,.pi-stock{margin:12px 0;font-size:.9rem}
.pi-shop a{color:var(--primary)}
.buy-form{margin-top:16px}
.qty{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.qty input{width:80px;padding:8px;border:1px solid var(--line);border-radius:6px}
.buy-btns{display:flex;gap:12px}
.favbtn{margin-top:14px;background:none;border:1px solid var(--line);padding:8px 16px;border-radius:6px;cursor:pointer;color:#666}
.favbtn.on{color:var(--primary);border-color:var(--primary)}
.card-block{background:#fff;border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);margin-bottom:18px}
.card-block h2{font-size:1.1rem;margin-bottom:14px;border-left:4px solid var(--primary);padding-left:10px}
.rich{white-space:pre-wrap;line-height:1.8;color:#444}
.course-content{border:2px solid #7c3aed}
.review{border-bottom:1px solid var(--line);padding:12px 0}
.review-head{display:flex;gap:10px;align-items:center;margin-bottom:4px}
.review-head small{color:var(--muted);font-size:.78rem}
.review-form{background:#fafafa;padding:14px;border-radius:8px;margin-bottom:16px}
.review-form select,.review-form textarea{display:block;width:100%;margin:8px 0;padding:8px;border:1px solid var(--line);border-radius:6px}
.star{color:#ddd}.star.on{color:#ffa800}

/* 購物車 / 表格 */
.cart-table{width:100%;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border-collapse:collapse}
.cart-table th,.cart-table td{padding:12px;text-align:left;border-bottom:1px solid var(--line);font-size:.9rem}
.cart-table th{background:#fafafa;font-size:.82rem;color:#666}
.ci-prod{display:flex;align-items:center;gap:10px}
.ci-img{width:54px;height:54px;background-size:cover;background-position:center;border-radius:6px;flex:none;background-color:#f0f0f0}
.ci-qty{width:64px;padding:6px;border:1px solid var(--line);border-radius:6px}
.cart-foot{display:flex;justify-content:flex-end;align-items:center;gap:18px;margin-top:18px;flex-wrap:wrap}
.cart-total{font-size:1.1rem}.cart-total b{color:var(--primary);font-size:1.4rem}

/* 結帳 */
.checkout{display:grid;grid-template-columns:1fr 340px;gap:18px}
.checkout-side{align-self:start}
.form-row{margin-bottom:14px}
.form-row label{display:block;font-size:.84rem;color:#555;margin-bottom:5px}
.form-row input,.form-row textarea,.form-row select{width:100%;padding:9px 11px;border:1px solid #ddd;border-radius:6px;font-size:.92rem;font-family:inherit}
.form-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pay-opt{display:block;padding:12px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px;cursor:pointer}
.pay-opt input{margin-right:8px}
.sum-row{display:flex;justify-content:space-between;padding:5px 0;font-size:.9rem}
.sum-row.total{font-size:1.1rem;font-weight:700}.sum-row.total b{color:var(--primary)}

/* 訂單 */
.order-box{background:#fff;border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.order-head{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:14px;font-size:.9rem}
.order-foot{display:flex;justify-content:space-between;margin-top:14px;flex-wrap:wrap;gap:12px}
.order-total b{color:var(--primary);font-size:1.3rem}
.badge{display:inline-block;padding:3px 10px;border-radius:12px;font-size:.78rem;font-weight:600}
.st-pending{background:#fff3e0;color:#e65100}.st-paid{background:#e3f2fd;color:#1565c0}
.st-shipped{background:#ede7f6;color:#5e35b1}.st-completed{background:#e8f5e9;color:#2e7d32}
.st-cancelled{background:#fafafa;color:#999}
.order-row{display:grid;grid-template-columns:1.5fr 1.5fr 1fr .8fr;align-items:center;gap:10px;
  background:#fff;border-radius:8px;padding:14px;box-shadow:var(--shadow);margin-bottom:10px;font-size:.88rem}
.order-row b{color:var(--primary);text-align:right}

/* 登入框 */
.auth-box{max-width:420px;margin:20px auto;background:#fff;border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}
.auth-box h1{font-size:1.3rem;margin-bottom:18px;text-align:center}
.auth-foot{text-align:center;margin-top:16px;font-size:.88rem;color:var(--muted)}
.auth-foot a{color:var(--primary)}

/* Dashboard（會員/賣家/管理）*/
.dash{display:grid;grid-template-columns:210px 1fr;gap:18px}
.dash-nav{background:#fff;border-radius:var(--radius);padding:12px;box-shadow:var(--shadow);align-self:start}
.dash-user{padding:10px;border-bottom:1px solid var(--line);margin-bottom:8px}
.dash-user b{display:block}.dash-user small{color:var(--muted);font-size:.76rem;word-break:break-all}
.dash-nav a{display:block;padding:9px 10px;border-radius:6px;font-size:.9rem;color:#555}
.dash-nav a:hover,.dash-nav a.on{background:#fff0eb;color:var(--primary);font-weight:600}
.dash-main{background:#fff;border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);min-height:60vh}
.dash-main h1{font-size:1.3rem;margin-bottom:18px}
.dash-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}
.stat{background:linear-gradient(135deg,#fff5f2,#ffece5);border-radius:10px;padding:18px;text-align:center}
.stat span{display:block;font-size:1.6rem;font-weight:800;color:var(--primary);margin-bottom:4px}
.admin-table{width:100%;border-collapse:collapse;font-size:.86rem}
.admin-table th,.admin-table td{padding:10px;border-bottom:1px solid var(--line);text-align:left}
.admin-table th{background:#fafafa;color:#666;font-size:.8rem}
.row-act{display:flex;gap:10px;align-items:center}
.row-act a{color:var(--primary)}
.inline-form,.inline-add{display:inline-flex;gap:8px;align-items:center}
.inline-form select,.inline-add input{padding:6px 8px;border:1px solid #ddd;border-radius:6px}
.inline-add{margin-bottom:16px}
.form-narrow{max-width:560px}
.thumb-row{display:flex;gap:8px;margin-top:8px}
.thumb-row span{width:56px;height:56px;background-size:cover;background-position:center;border-radius:6px;border:1px solid var(--line)}

/* 店鋪 */
.shop-hero{display:flex;gap:20px;align-items:center;background:linear-gradient(120deg,var(--primary),var(--accent));
  color:#fff;border-radius:14px;padding:26px;margin-bottom:22px}
.shop-logo{width:84px;height:84px;border-radius:50%;background:#fff;color:var(--primary);font-size:2.4rem;
  font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.shop-meta h1{font-size:1.5rem}.shop-meta p{opacity:.92;margin:6px 0}
.shop-stats{display:flex;gap:18px;font-size:.86rem}

/* 金流模擬付款頁 */
.pay-wrap{display:flex;justify-content:center;padding:20px 0}
.pay-card{background:#fff;border-radius:14px;box-shadow:var(--shadow);padding:26px;max-width:460px;width:100%;border-top:5px solid var(--primary)}
.pay-brand{font-size:.9rem;color:var(--muted);margin-bottom:14px}
.pay-amt{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px dashed var(--line);padding-bottom:14px;margin-bottom:8px}
.pay-amt b{font-size:1.9rem;color:var(--primary);font-weight:800}
.pay-order{font-size:.82rem;color:var(--muted);margin-bottom:16px}
.pay-form label{display:block;font-size:.8rem;color:#555;margin:10px 0 4px}
.pay-form input{width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;background:#fafafa;font-family:monospace;letter-spacing:1px}
.pay-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pay-actions{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.pay-back{text-align:center;margin-top:14px;font-size:.85rem}.pay-back a{color:var(--primary)}
.pay-api-note{margin-top:18px;padding:12px;background:#f6f8fc;border-radius:8px;font-size:.76rem;color:#555;line-height:1.7}
.pay-api-note code{background:#e8edf6;padding:1px 6px;border-radius:4px;color:#1565c0}

.empty{text-align:center;padding:50px 20px;color:var(--muted)}
.empty h2{font-size:2rem;color:#ccc;margin-bottom:10px}
.empty .btn{margin-top:14px}
.muted{color:var(--muted)}.small{font-size:.8rem}
.ok-text{color:#0b8063;font-size:.88rem;margin-top:8px}.err-text{color:#a83232;font-size:.88rem;margin-top:8px}

/* 課程平台 */
.path-grid,.event-grid,.article-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.path-card,.event-card,.article-card{background:#fff;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px;min-height:130px}
.path-card b,.event-card b,.article-card b{font-size:1rem}.path-card span,.event-card span,.article-card span{color:var(--muted);font-size:.88rem}.event-card small,.article-card small{color:var(--primary);font-size:.78rem;font-weight:700}
.page-head{margin-bottom:18px}.page-head h1{font-size:1.55rem}.page-head p{color:var(--muted);margin-top:6px}
.course-top{display:grid;grid-template-columns:minmax(300px,480px) 1fr;gap:24px;background:#fff;border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);margin-bottom:20px}
.course-hero-media{min-height:360px;background-size:cover;background-position:center;border-radius:8px;position:relative}
.course-hero-media span{position:absolute;top:14px;left:14px;background:var(--primary);color:#fff;border-radius:999px;padding:5px 12px;font-size:.82rem;font-weight:700}
.course-info h1{font-size:1.75rem;line-height:1.25;margin-bottom:8px}.course-subtitle{color:#52616b;font-size:1rem;margin-bottom:12px}
.teacher-line{margin:10px 0;color:#52616b}.teacher-line a{color:var(--primary);font-weight:700}
.tag-row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.tag-row span{background:#eef8f6;color:#0b6b5a;border-radius:999px;padding:5px 10px;font-size:.8rem;font-weight:700}
.progress-box{height:18px;background:#e7ecef;border-radius:999px;overflow:hidden;position:relative;margin:12px 0}.progress-box b{display:block;height:100%;background:linear-gradient(90deg,var(--primary),#2bb3a3)}.progress-box span{position:absolute;left:10px;top:0;font-size:.72rem;font-weight:800;color:#17202a;line-height:18px}
.course-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:18px}.course-side{display:flex;flex-direction:column;gap:14px}.side-box{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}.side-box h3{margin-bottom:10px}.side-box p,.side-box li{color:#52616b;font-size:.88rem}.side-box ul{padding-left:18px}
.check-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}.check-list span{background:#f4fbf9;border:1px solid #d5eee8;border-radius:8px;padding:10px}
.curriculum details{border:1px solid var(--line);border-radius:8px;margin-bottom:10px;overflow:hidden}.curriculum summary{cursor:pointer;padding:13px 14px;background:#f8fafb;font-weight:800}.curriculum summary small{float:right;color:var(--muted);font-weight:400}
.lecture-row{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border-top:1px solid var(--line);font-size:.9rem}.lecture-row small{color:var(--muted);white-space:nowrap}
.notice-row,.discussion-row,.assignment-box{border:1px solid var(--line);border-radius:8px;padding:14px;margin:10px 0;background:#fff}.notice-row small,.discussion-row small{display:block;color:var(--muted);font-size:.78rem;margin-top:4px}
.coupon-row{display:flex;gap:8px}.coupon-row input{flex:1;padding:9px 11px;border:1px solid #ddd;border-radius:6px}.coupon-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.coupon-card{background:#fff7e0;border:1px dashed #dba83b;border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:5px}
.learning-list{display:grid;gap:12px}.learning-item{display:grid;grid-template-columns:62px 1fr auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:12px}
.learn-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:12px}.learn-head h1{font-size:1.35rem}.learn-progress{width:300px}
.learn-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.learn-tabs a{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:.88rem}.learn-tabs a.on{background:var(--primary);color:#fff;border-color:var(--primary)}
.learn-layout{display:grid;grid-template-columns:300px 1fr;gap:18px}.learn-nav{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:12px;align-self:start}.learn-nav summary{font-weight:800;cursor:pointer;padding:8px}.learn-nav a{display:block;padding:9px;border-radius:6px;font-size:.86rem;color:#52616b}.learn-nav a.on,.learn-nav a:hover{background:#eef8f6;color:var(--primary)}.learn-nav a span{font-size:.68rem;text-transform:uppercase;margin-right:6px;color:var(--muted)}
.video-box{aspect-ratio:16/9;background:linear-gradient(135deg,#17202a,#117a65);border-radius:10px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;margin-bottom:16px;text-align:center;padding:20px}.video-box b{font-size:1.3rem}.video-box span{opacity:.8}
.learn-main textarea,.assignment-box textarea,.quiz-form textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;font-family:inherit;margin-bottom:10px}
.quiz-form fieldset{border:1px solid var(--line);border-radius:8px;padding:12px;margin-bottom:12px}.quiz-form legend{font-weight:800}.quiz-form label{display:block;padding:6px 0}
.course-builder{display:grid;grid-template-columns:1.2fr .7fr .5fr .5fr auto;gap:8px;align-items:center}.course-builder input,.course-builder select,.course-builder textarea{padding:8px;border:1px solid var(--line);border-radius:6px}.course-builder textarea{grid-column:1/-1}.check-inline{font-size:.82rem;white-space:nowrap}
.article-page{max-width:760px;margin:0 auto;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:28px}.article-page h1{font-size:1.8rem;margin:12px 0}.article-meta{color:var(--muted);margin-bottom:18px}
.live-detail{display:grid;grid-template-columns:1fr 300px;gap:18px;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}.live-detail h1{font-size:1.7rem;margin:8px 0}
.certificate{display:flex;justify-content:center}.certificate-inner{max-width:760px;width:100%;background:#fff;border:8px solid #d7b56d;border-radius:8px;text-align:center;padding:48px 28px;box-shadow:var(--shadow)}.certificate h1{font-size:2rem;color:#9a6b15}.certificate h2{font-size:1.8rem;margin:16px 0}.certificate h3{font-size:1.25rem;margin:16px 0;color:var(--primary)}.cert-meta{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;color:var(--muted);margin:24px 0}

/* Footer */
.site-footer{background:#fff;border-top:1px solid var(--line);margin-top:40px;padding:30px 0 0}
.footer-inner{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding-bottom:20px}
.footer-inner h4{font-size:.95rem;margin-bottom:10px}
.footer-inner a{display:block;color:var(--muted);font-size:.85rem;padding:3px 0}
.footer-inner a:hover{color:var(--primary)}
.copyright{text-align:center;padding:16px;border-top:1px solid var(--line);color:var(--muted);font-size:.8rem}

/* ── 響應式 ── */
@media(max-width:900px){
  .listing,.checkout,.dash{grid-template-columns:1fr}
  .product-top{grid-template-columns:1fr;gap:16px}
  .hero-learning,.course-top,.course-layout,.learn-layout,.live-detail{grid-template-columns:1fr}
  .course-side{order:2}.learn-progress{width:100%}.learn-head{align-items:stretch;flex-direction:column}
  .gallery-main{padding-top:70%}
  .filters,.dash-nav{position:static}
  .dash-nav{display:flex;flex-wrap:wrap;gap:6px}
  .dash-nav a{flex:1;text-align:center}
  .dash-user{width:100%}
}
@media(max-width:600px){
  body{font-size:14px}
  .header-main{flex-wrap:wrap;gap:10px}
  .logo{font-size:1.3rem}
  .search{order:3;width:100%;flex-basis:100%}
  .hero{padding:30px 20px}.hero h1{font-size:1.4rem}
  .hero-panel b{font-size:1.5rem}
  .hero-panel div{display:grid;grid-template-columns:64px 1fr;justify-content:start;gap:12px}
  .pgrid{grid-template-columns:repeat(2,1fr);gap:8px}
  .course-top{padding:14px}.course-hero-media{min-height:230px}.course-info h1{font-size:1.35rem}
  .course-builder{grid-template-columns:1fr}.course-builder textarea{grid-column:auto}
  .lecture-row,.learning-item{grid-template-columns:1fr;display:grid}
  .coupon-row{flex-direction:column}
  .article-page,.certificate-inner{padding:22px 16px}.cert-meta{display:grid}
  .order-head{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr 1fr}
  .order-row{grid-template-columns:1fr 1fr}
  .cart-table thead{display:none}
  .cart-table,.cart-table tbody,.cart-table tr,.cart-table td{display:block;width:100%}
  .cart-table tr{margin-bottom:12px;border:1px solid var(--line);border-radius:8px}
  .cart-table td{border:none;text-align:left}
}