@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700;900&family=Poppins:wght@400;500;600;700&display=swap");
/* Maker CI E6 · 黃信惠的瘋狂教室 — shared app-family layer (v2 preview) */
:root{--dh-blue:#1B2BFF;--dh-ink:#0E1821;--dh-gray:#8293A1;--dh-mist:#F2F2F2;--dh-line:#E3E6EA;--dh-font:"Poppins","Noto Sans TC",-apple-system,BlinkMacSystemFont,"PingFang TC","Microsoft JhengHei",sans-serif}
body[data-app]{font-family:var(--dh-font)!important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body[data-app] :is(button,input,select,textarea){font-family:inherit}
/* top family bar */
.dh-family{position:relative;z-index:50;font:500 13px/1.4 var(--dh-font);background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(16px);backdrop-filter:saturate(180%) blur(16px);color:var(--dh-ink);border-bottom:1px solid var(--dh-line);padding:10px max(20px,calc((100% - 1120px)/2));display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;box-sizing:border-box}
.dh-family a{color:var(--dh-ink);text-decoration:none}
.dh-left{display:flex;align-items:center;gap:14px;min-width:0}
.dh-logo{display:inline-flex;align-items:center;flex:none;line-height:0}
.dh-logo img{height:20px;width:auto;display:block}
.dh-family .dh-brand{font-weight:500;color:var(--dh-gray);padding-left:14px;border-left:1px solid var(--dh-line);white-space:nowrap}
.dh-family .dh-brand:hover{color:var(--dh-ink)}
.dh-family nav{display:flex;gap:2px;padding:3px;margin:0;max-width:none;background:var(--dh-mist);border-radius:999px;font-size:13px}
.dh-family nav a{padding:6px 14px;border-radius:999px;color:#4A5763;white-space:nowrap;transition:background .2s,color .2s}
.dh-family nav a:hover{color:var(--dh-ink)}
.dh-family nav a[aria-current=page]{background:#fff;color:var(--dh-ink);font-weight:600;box-shadow:0 1px 3px rgba(14,24,33,.12)}
.dh-family a:focus-visible,.dh-credit a:focus-visible,.dh-maker a:focus-visible{outline:2px solid var(--dh-blue);outline-offset:3px;border-radius:6px}
/* "other tools" card */
.dh-maker{max-width:1040px;margin:72px auto 0;padding:40px 32px;border:0;border-top:1px solid var(--dh-line);border-radius:0;background:transparent;color:var(--dh-ink);font:15px/1.7 var(--dh-font);text-align:center;box-sizing:border-box}
.dh-maker strong{display:block;font-size:22px;font-weight:700;letter-spacing:-.01em}
.dh-maker p{margin:8px auto 20px;color:#56636F;max-width:560px}
.dh-maker .dh-choices{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.dh-maker .dh-choices a{padding:9px 16px;border-radius:999px;background:var(--dh-mist);color:var(--dh-ink);text-decoration:none;font-size:14px;transition:background .2s}
.dh-maker .dh-choices a:hover{background:#E6E8EB}
.dh-maker a{color:var(--dh-blue);text-decoration:none}
.dh-maker p:last-child{margin:20px auto 0}
.dh-maker p:last-child a:hover{text-decoration:underline;text-underline-offset:4px}
/* E6 credit footer */
.dh-credit{background:var(--dh-ink);color:#C9D1D8;font:500 13px/1.6 var(--dh-font);padding:36px 20px 40px;margin-top:56px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.dh-maker+.dh-credit{margin-top:56px}
.dh-credit a{line-height:0}
.dh-credit img{height:26px;width:auto;display:block}
.dh-credit span{letter-spacing:.08em;color:var(--dh-gray)}
@media(max-width:720px){.dh-family .dh-brand{display:none}}
@media(max-width:600px){.dh-family{flex-direction:column;align-items:stretch;gap:10px;padding:10px 16px}.dh-left{justify-content:center}.dh-logo img{height:18px}.dh-family nav{justify-content:center}.dh-family nav a{flex:1;text-align:center;padding:7px 8px}.dh-maker{margin:48px 16px 0;padding:32px 4px}.dh-credit img{height:22px}}
/* per-app: shared E6 neutrals, one own accent each */
body[data-app=tabcourio]{background:#fff!important;color:var(--dh-ink)!important}
body[data-app=tabcourio] h1,body[data-app=tabcourio] h2,body[data-app=tabcourio] .wordmark{color:var(--dh-ink)}
body[data-app=tabcourio] .lead{color:#56636F}
body[data-app=tabcourio] section{border-top-color:var(--dh-line)}
body[data-app=tabcourio] .brand{border-radius:22%;box-shadow:0 10px 30px rgba(14,24,33,.12)}
body[data-app=classroomportal]{--ink:#0E1821;--body:#56636F;--line:#E3E6EA;--paper:#FAFAF8}
body[data-app=linkpad]{--ink:#0E1821;--muted:#56636F;--line:#E3E6EA;--paper:#FAFAF8;background:var(--paper)}
.dh-family{justify-content:space-between}
body[data-app=linkpad] .creator-logo{box-sizing:border-box;width:300px;height:auto;aspect-ratio:auto;object-fit:contain;background:#fff;padding:34px 28px;border-radius:14px;border:1px solid var(--dh-line)}
@media(max-width:1100px){body[data-app=linkpad] .creator-logo{width:240px;padding:26px 22px}}
@media(max-width:580px){body[data-app=linkpad] .creator-logo{width:100%;max-width:320px;padding:24px 22px}}
/* ---- layout audit fixes (v2.1) ---- */
body[data-app] :is(h1,h2,h3){text-wrap:balance}
body[data-app] :is(p,li,dd,figcaption){text-wrap:pretty}
.dh-maker p{text-wrap:balance;max-width:620px}
/* align family bar + maker card to each site's content column */
:root{--dh-wrap:1120px;--dh-gut:20px}
body[data-app=tabcourio]{--dh-wrap:984px;--dh-gut:28px}
body[data-app=classroomportal]{--dh-wrap:1216px;--dh-gut:40px}
body[data-app=linkpad]{--dh-wrap:1200px;--dh-gut:40px}
body[data-app=classroomportal][data-page=privacy]{--dh-wrap:820px;--dh-gut:24px}
body[data-app=linkpad][data-page=privacy]{--dh-wrap:750px;--dh-gut:20px}
.dh-family{padding-left:max(var(--dh-gut),calc((100% - var(--dh-wrap))/2));padding-right:max(var(--dh-gut),calc((100% - var(--dh-wrap))/2))}
.dh-maker{max-width:var(--dh-wrap);width:calc(100% - 2*var(--dh-gut));margin:24px auto 0;padding:48px 0 8px}
@media(max-width:1100px){body[data-app=classroomportal]:not([data-page]),body[data-app=linkpad]:not([data-page]){--dh-gut:24px}}
@media(max-width:600px){.dh-family{padding:10px var(--dh-gut)}.dh-maker{margin:16px auto 0;padding:36px 0 4px}body[data-app=classroomportal]:not([data-page]),body[data-app=linkpad]:not([data-page]){--dh-gut:18px}}
/* TabCourio: header row aligned to content column; buttons spaced evenly */
body[data-app=tabcourio]:not([data-page])>nav{max-width:1040px;padding:24px 28px}
body[data-app=tabcourio] p:has(>.button+.button){display:flex;flex-wrap:wrap;gap:12px;margin:15px 0}
body[data-app=tabcourio] p:has(>.button+.button) .button{margin:0}
@media(max-width:600px){body[data-app=tabcourio] p:has(>.button+.button) .button{flex:1 1 100%;text-align:center}}
/* footer rows: even breathing room before the maker card */
body[data-app=classroomportal] .site-footer,body[data-app=linkpad] .site-footer{padding-top:28px}
body[data-app] :is(h1,h2){word-break:keep-all;overflow-wrap:anywhere}
.dh-hero-mark{display:block;height:22px;width:auto;margin:0 0 20px}
@media(max-width:600px){.dh-hero-mark{height:18px;margin-bottom:16px}}