:root{--navy:#0f2b46;--blue:#1667d9;--teal:#0e9488;--ink:#20303f;--sub:#5c6f80;--line:#dfe7ee;--bg:#f4f7fa;--card:#ffffff;--tipbg:#f0faf8;--tipline:#bfe5df;--code:#102a43;}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;background:var(--bg);color:var(--ink);line-height:1.65;font-size:16px}
/* ---------- layout ---------- */
#side{position:fixed;top:0;left:0;width:272px;height:100vh;background:#fff;border-right:1px solid var(--line);padding:20px 16px;overflow-y:auto;z-index:50}
#wrap{margin-left:272px}
main{max-width:880px;margin:0 auto;padding:0 28px 80px}
@media(max-width:1023px){#side{position:static;width:auto;height:auto;border-right:none;border-bottom:1px solid var(--line)}#wrap{margin-left:0}main{padding:0 16px 60px}}
/* ---------- sidebar ---------- */
.brand{font-weight:800;font-size:17px;color:var(--navy);letter-spacing:.4px;margin-bottom:14px}
.brand b{color:var(--blue)}
.brand small{display:block;font-weight:500;color:var(--sub);font-size:11px;letter-spacing:0;margin-top:2px}
#q{width:100%;padding:9px 12px;border:1.5px solid var(--line);border-radius:9px;font-size:14px;font-family:inherit;outline:none}
#q:focus{border-color:var(--blue)}
#cnt{font-size:12px;color:var(--sub);margin:8px 0 14px}
#toc p.pt{font-size:11px;font-weight:700;color:var(--teal);letter-spacing:.6px;margin:16px 0 6px;text-transform:uppercase}
#toc a{display:flex;gap:8px;align-items:baseline;padding:5px 8px;border-radius:7px;font-size:13.5px;color:var(--ink);text-decoration:none}
#toc a:hover{background:#eef4fb;color:var(--blue)}
#toc a i{font-style:normal;font-size:11px;color:#9db0c0;font-variant-numeric:tabular-nums;min-width:22px}
/* ---------- cover ---------- */
#cover{background:linear-gradient(135deg,#0f2b46 0%,#123a63 55%,#0e5e74 100%);color:#fff;border-radius:0 0 22px 22px;padding:64px 40px 52px;margin:0 -4px}
#cover .eyebrow{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);padding:5px 14px;border-radius:99px;font-size:12.5px;letter-spacing:1px;font-weight:600}
#cover h1{font-size:clamp(30px,4.6vw,46px);font-weight:800;margin:22px 0 10px;letter-spacing:-.5px}
#cover h1 span{color:#7dd8cc}
#cover .sub{font-size:clamp(15px,2vw,19px);color:#cfe0ef;font-weight:400}
#cover .ai{margin-top:14px;font-size:13px;color:#9fc1dd;letter-spacing:.5px}
.stats{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.stats div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:13px;padding:14px 22px;min-width:130px}
.stats b{display:block;font-size:24px;font-weight:800;color:#fff}
.stats span{font-size:12.5px;color:#b7cfe4}
/* ---------- intro ---------- */
.intro{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:30px 32px;margin-top:26px}
.intro h2{font-size:20px;color:var(--navy);margin-bottom:12px}
.intro p{color:#3d5266;font-size:15.5px;margin-bottom:10px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:18px 0 4px}
.steps div{background:#f7fafc;border:1px solid var(--line);border-radius:12px;padding:14px 16px;font-size:14px;color:#3d5266}
.steps b{display:block;color:var(--blue);font-size:13px;margin-bottom:5px}
.caution{background:#fff8f0;border:1px solid #f3ddc2;border-radius:12px;padding:16px 20px;margin-top:16px;font-size:14px;color:#6b543a}
.caution b{color:#b4690e}
.caution ul{margin:8px 0 0 18px}
.caution li{margin-bottom:4px}
/* ---------- part / chapter ---------- */
.part{margin:64px 0 8px;padding:30px 34px;background:linear-gradient(120deg,#123a63,#0e6e80);border-radius:16px;color:#fff}
.part span{font-size:12px;font-weight:700;letter-spacing:1.5px;color:#8fd8ce}
.part h2{font-size:24px;font-weight:800;margin-top:6px}
.part p{font-size:13px;color:#bcd6e8;margin-top:4px}
.ch{margin-top:46px}
.ch h3{font-size:21px;color:var(--navy);padding-bottom:10px;border-bottom:2px solid var(--navy);margin-bottom:6px}
.ch h3 em{font-style:normal;display:block;font-size:11.5px;font-weight:700;letter-spacing:1.2px;color:var(--teal);margin-bottom:4px;text-transform:uppercase}
.chintro{color:var(--sub);font-size:14.5px;margin-bottom:22px}
/* ---------- prompt card ---------- */
.p{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin-bottom:18px}
.p h4{font-size:16.5px;color:var(--navy);display:flex;align-items:center;gap:10px;margin-bottom:8px}
.n{background:var(--navy);color:#fff;font-size:12px;font-weight:700;padding:3px 9px;border-radius:7px;font-variant-numeric:tabular-nums;flex-shrink:0}
.use{font-size:14px;color:var(--sub);margin-bottom:14px}
.box{border:1px solid #cdd9e4;border-radius:11px;overflow:hidden;background:var(--code)}
.bar{display:flex;justify-content:space-between;align-items:center;background:#1b3a57;padding:7px 12px}
.bar span{font-size:11.5px;font-weight:600;color:#9fc1dd;letter-spacing:.5px}
.cp{background:#2d5378;color:#dbe9f5;border:none;font-size:12px;font-weight:600;padding:4px 12px;border-radius:6px;cursor:pointer;font-family:inherit}
.cp:hover{background:var(--teal);color:#fff}
.cp.ok{background:var(--teal);color:#fff}
.box pre{padding:15px 17px;font-family:inherit;font-size:13.8px;line-height:1.62;color:#e8f0f7;white-space:pre-wrap;word-break:break-word}
.tip{margin-top:13px;background:var(--tipbg);border:1px solid var(--tipline);border-radius:11px;padding:14px 17px}
.th{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:#0b6e64;background:linear-gradient(90deg,#e7f7f4,#eaf2ff);border:1px solid #bfe5df;border-radius:99px;padding:4px 12px;margin-bottom:8px;letter-spacing:.2px}
.tip>p:not(.th){font-size:14px;color:#274b46;margin-bottom:10px}
.tip .box{border-color:#a9d9d2}
.tip .bar{background:#0d5f57}
.tip .box pre{font-size:13.2px}
.box.mini pre{padding:11px 14px}
/* ---------- misc ---------- */
.hide{display:none!important}
#top{position:fixed;right:22px;bottom:22px;background:var(--navy);color:#fff;border:none;border-radius:99px;width:44px;height:44px;font-size:18px;cursor:pointer;box-shadow:0 4px 14px rgba(15,43,70,.3);z-index:60}
footer{margin-top:70px;padding-top:24px;border-top:1px solid var(--line);color:var(--sub);font-size:13px;text-align:center}
footer b{color:var(--navy)}
@media print{#side,#top,.cp{display:none}#wrap{margin:0}.p{break-inside:avoid;border:1px solid #ccc}#cover{background:#123a63}}

/* ---------- main TOC ---------- */
.maintoc{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px 26px;margin-top:26px}
.maintoc .mt-head h2{font-size:21px;color:var(--navy)}
.maintoc .mt-head p{color:var(--sub);font-size:14px;margin:6px 0 14px}
.mt-quick{display:flex;flex-wrap:wrap;gap:8px}
.mt-quick a{background:#eef4fb;color:var(--blue);border:1px solid #d5e3f5;border-radius:99px;padding:6px 15px;font-size:13px;font-weight:700;text-decoration:none}
.mt-quick a:hover{background:var(--blue);color:#fff}
.mt-group{font-size:11.5px;font-weight:800;letter-spacing:.6px;color:var(--teal);text-transform:uppercase;margin:20px 0 10px;padding-top:14px;border-top:1px dashed var(--line)}
.tocgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(252px,1fr));gap:12px}
.tocpart{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fbfdff}
.tocpart .tp-title{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;text-decoration:none;margin-bottom:9px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.tocpart .tp-title b{color:var(--blue);font-size:10.5px;font-weight:800;letter-spacing:.5px}
.tocpart .tp-title span{color:var(--navy);font-size:15px;font-weight:800}
.tocpart .tp-title em{font-style:normal;color:var(--sub);font-size:11.5px;flex-basis:100%}
.tocpart .tp-title i{font-style:normal;color:#9db0c0;font-size:11px;font-variant-numeric:tabular-nums;margin-left:auto}
.tocpart .tp-title:hover span{color:var(--blue)}
.tp-chips{display:flex;flex-direction:column;gap:1px}
.tp-chips a{display:flex;gap:9px;align-items:baseline;padding:5px 8px;border-radius:7px;font-size:13px;color:var(--ink);text-decoration:none}
.tp-chips a:hover{background:#eef4fb;color:var(--blue)}
.tp-chips a b{color:#9db0c0;font-weight:700;font-size:11px;min-width:20px;font-variant-numeric:tabular-nums}
#noresult{background:#fff8f0;border:1px solid #f3ddc2;border-radius:12px;padding:26px 22px;text-align:center;color:#6b543a;font-size:15px;margin-top:24px}
/* ---------- search clear ---------- */
.qwrap{position:relative}
#qclear{display:none;position:absolute;right:6px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:none;background:#e6edf4;color:#5c6f80;border-radius:50%;cursor:pointer;font-size:14px;line-height:1;align-items:center;justify-content:center;padding:0}
#qclear:hover{background:var(--blue);color:#fff}
/* ---------- mobile UX ---------- */
@media(max-width:1023px){
  html{scroll-padding-top:140px}
  #side{position:sticky;top:0;z-index:60;box-shadow:0 2px 10px rgba(15,43,70,.07);padding:12px 16px}
  #toc{display:none}
  #cnt{margin:6px 0 0}
  .tocgrid{grid-template-columns:1fr}
}

/* ---------- TOC accordion ---------- */
.mt-exp{margin-top:12px;background:var(--navy);color:#fff;border:none;border-radius:9px;padding:8px 16px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit}
.mt-exp:hover{background:var(--blue)}
.tp-chaps{display:flex;flex-direction:column;gap:1px}
.tp-chbtn{display:flex;align-items:baseline;gap:8px;width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:5px 8px;border-radius:7px;font-family:inherit;font-size:13px;color:var(--ink)}
.tp-chbtn:hover{background:#eef4fb;color:var(--blue)}
.tp-chbtn .arw{color:#9db0c0;font-size:10px;display:inline-block;transition:transform .15s}
.tp-chbtn.open .arw{transform:rotate(90deg);color:var(--blue)}
.tp-chbtn>b{color:#9db0c0;font-weight:700;font-size:11px;min-width:20px;font-variant-numeric:tabular-nums}
.tp-chbtn .tp-chttl{font-weight:600}
.tp-chbtn>i{font-style:normal;color:#c2ccd6;font-size:10.5px;margin-left:auto;font-variant-numeric:tabular-nums}
.tp-prompts{display:flex;flex-direction:column;gap:1px;margin:2px 0 6px 24px;padding-left:8px;border-left:1px solid var(--line)}
.tp-prompts a{display:flex;gap:8px;align-items:baseline;padding:4px 8px;border-radius:6px;font-size:12.5px;color:var(--sub);text-decoration:none}
.tp-prompts a:hover{background:#f0faf8;color:var(--teal)}
.tp-prompts a b{color:#b7c2cd;font-weight:600;font-size:10.5px;min-width:26px;font-variant-numeric:tabular-nums}
/* ---------- favorites ---------- */
.fav{margin-left:auto;flex-shrink:0;background:none;border:none;cursor:pointer;font-size:19px;line-height:1;color:#cfd8e0;padding:0 2px}
.fav:hover{color:#f5a623;transform:scale(1.12)}
.fav.on{color:#f5a623}
.p h4 .h4t{flex:1 1 auto;min-width:0}
.favbtn{width:100%;margin:8px 0 2px;background:#fff;border:1.5px solid var(--line);border-radius:9px;padding:8px 12px;font-size:13px;font-weight:700;color:var(--ink);cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:7px}
.favbtn:hover{border-color:#f5a623;color:#b9791a}
.favbtn.on{background:#fff7ec;border-color:#f5a623;color:#b9791a}
.favbtn b{background:#eef2f6;border-radius:99px;padding:1px 8px;font-size:12px;font-variant-numeric:tabular-nums}
.favbtn.on b{background:#ffe6c2}

/* ---------- gift / free-to-share ---------- */
.gift{margin-top:30px;max-width:770px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-left:3px solid #7dd8cc;border-radius:14px;padding:22px 26px}
.gift-badge{display:inline-block;background:rgba(125,216,204,.16);border:1px solid rgba(125,216,204,.42);color:#a7e8dd;font-size:11.5px;font-weight:700;letter-spacing:1.2px;padding:5px 13px;border-radius:99px;margin-bottom:14px}
.gift-lead{font-size:clamp(16px,2.1vw,19px);font-weight:700;color:#fff;margin-bottom:10px;line-height:1.5;letter-spacing:-.2px}
.gift-body{font-size:14.5px;color:#cfe0ef;line-height:1.75;margin-bottom:13px}
.gift-free{font-size:14.5px;color:#eaf7f4;line-height:1.75;background:rgba(125,216,204,.09);border-radius:10px;padding:13px 16px}
.gift-free b{color:#7dd8cc}
@media(max-width:600px){.gift{padding:18px 18px}}
#homebtn{cursor:pointer;text-decoration:none;color:inherit;display:block;transition:opacity .15s}#homebtn:hover{opacity:.7}

/* placeholder highlight */
.ph{background:rgba(125,216,204,.16);color:#8fe0d4;border-radius:4px;padding:0 3px;font-weight:600}
.cp.ok{background:var(--teal);color:#fff}
/* toast */
.toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%) translateY(18px);background:#0f2b46;color:#fff;padding:12px 20px;border-radius:11px;font-size:14px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.28);opacity:0;pointer-events:none;transition:.25s;z-index:200;max-width:88vw;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast b{color:#7dd8cc}
/* sidebar quick chips */
.qchips{display:flex;flex-wrap:wrap;gap:6px;margin:11px 0 2px;align-items:center}
.qchips>span{font-size:10.5px;color:var(--sub);font-weight:800;letter-spacing:.5px}
.qchips button{background:#eef4fb;border:1px solid var(--line);color:var(--blue);border-radius:99px;padding:4px 10px;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit}
.qchips button:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.sidetools{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 2px;padding-top:12px;border-top:1px solid var(--line)}
.sidetools button,.sidetools label{flex:1 1 40%;text-align:center;background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 6px;font-size:11px;font-weight:700;color:var(--ink);cursor:pointer;font-family:inherit}
.sidetools button:hover,.sidetools label:hover{border-color:var(--blue);color:var(--blue)}
/* gift share buttons */
.gift-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.gift-actions button{background:#7dd8cc;color:#0c2a3f;border:none;border-radius:9px;padding:10px 18px;font-size:13.5px;font-weight:800;cursor:pointer;font-family:inherit}
.gift-actions button:hover{background:#93e4d9}
.gift-actions #copylink{background:rgba(255,255,255,.1);color:#e7f5f2;border:1px solid rgba(255,255,255,.25)}
.gift-actions #copylink:hover{background:rgba(255,255,255,.18)}
/* floating theme */
#theme{position:fixed;left:22px;bottom:22px;background:var(--navy);color:#fff;border:none;border-radius:99px;padding:11px 17px;font-size:13px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(15,43,70,.3);z-index:60;font-family:inherit}
#theme:hover{background:var(--blue)}
@media(max-width:1023px){.qchips,.sidetools{display:none}#theme{padding:9px 13px;font-size:12px;left:16px;bottom:16px}}
/* ================= DARK MODE ================= */
html.dark{--bg:#0e1621;--card:#17222f;--ink:#e6eef6;--sub:#9fb1c1;--line:#28343f;--tipbg:#12241f;--tipline:#20463f}
.dark #side{background:#111a24}
.dark .brand{color:#e6eef6}
.dark .brand b{color:#5b9bf0}
.dark #q{background:#0e1621;color:#e6eef6}
.dark #q::placeholder{color:#6f8296}
.dark #toc a:hover{background:#15202c;color:#5b9bf0}
.dark #toc a i{color:#6f8296}
.dark .intro h2{color:#e6eef6}
.dark .intro p{color:#c3d2df}
.dark .steps div{background:#131c26;color:#c3d2df}
.dark .caution{background:#241a10;border-color:#4a3a26;color:#e0c9a6}
.dark .caution b{color:#e0a860}
.dark .ch h3{color:#e6eef6;border-color:#37506b}
.dark .p h4{color:#e6eef6}
.dark .n{background:#294863}
.dark .box{border-color:#2b3c4d}
.dark .th{background:linear-gradient(90deg,#12312b,#152740);color:#8fe0d4;border-color:#20463f}
.dark .tip>p:not(.th){color:#bfe0d8}
.dark .tip .box{border-color:#2b4a44}
.dark footer b{color:#e6eef6}
.dark .maintoc .mt-head h2{color:#e6eef6}
.dark .mt-quick a{background:#15202c;border-color:#2b3c4d;color:#5b9bf0}
.dark .tocpart{background:#131c26}
.dark .tocpart .tp-title span{color:#e6eef6}
.dark .tp-chbtn:hover{background:#15202c;color:#5b9bf0}
.dark .tp-prompts a:hover{background:#12241f;color:#8fe0d4}
.dark #noresult{background:#241a10;border-color:#4a3a26;color:#e0c9a6}
.dark .favbtn{background:#131c26;color:#e6eef6}
.dark .favbtn b{background:#2b3c4d;color:#e6eef6}
.dark .favbtn.on b{background:#4a3a1a;color:#ffe6a0}
.dark .favbtn.on{background:#2a2113;border-color:#f5a623;color:#f0b855}
.dark .qchips button{background:#15202c;border-color:#2b3c4d;color:#5b9bf0}
.dark .sidetools button,.dark .sidetools label{background:#131c26;color:#e6eef6}
.dark #theme{background:#7dd8cc;color:#0f2b46}
.dark #theme:hover{background:#93e4d9}
.dark #top{background:#294863}
@media print{#theme,#toast,.fav,.mt-exp,.qchips,.sidetools,.gift-actions{display:none!important}}

/* category TOC */
.catsec{margin-top:24px;padding-top:20px;border-top:1px dashed var(--line)}
.catsec:first-of-type{border-top:none;margin-top:8px;padding-top:0}
.cat-h{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.cat-h h3{font-size:18px;color:var(--navy);scroll-margin-top:24px}
.cat-meta{font-size:12px;color:var(--sub);font-weight:600}
.cat-chaps{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:2px 22px;align-items:start}
.ctags{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 7px 26px}
.ctag{font-style:normal;font-size:10.5px;font-weight:700;color:var(--teal);background:#eafaf7;border:1px solid var(--tipline);border-radius:99px;padding:2px 8px}
.dark .cat-h h3{color:#e6eef6}
.dark .ctag{background:#12241f;border-color:#20463f;color:#8fe0d4}

/* bar layout with fill button */
.bar{justify-content:flex-start;gap:6px}
.bar>span{margin-right:auto}
.fillbtn{background:#2d5378;color:#dbe9f5;border:none;font-size:12px;font-weight:600;padding:4px 11px;border-radius:6px;cursor:pointer;font-family:inherit}
.fillbtn:hover{background:var(--teal);color:#fff}
/* fill modal */
.fillmodal{position:fixed;inset:0;background:rgba(8,20,32,.55);display:flex;align-items:center;justify-content:center;z-index:300;padding:20px}
.fillmodal.hide{display:none!important}
.fill-box{background:var(--card);border:1px solid var(--line);border-radius:16px;max-width:560px;width:100%;max-height:88vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.fill-head{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;border-bottom:1px solid var(--line)}
.fill-head b{font-size:16px;color:var(--navy)}
#fillclose{background:none;border:none;font-size:18px;cursor:pointer;color:var(--sub);line-height:1}
.fill-body{padding:16px 20px;overflow-y:auto}
.fill-hint{font-size:12.5px;color:var(--sub);margin-bottom:14px;line-height:1.5}
.fill-field{margin-bottom:11px}
.fill-field label{display:block;font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:5px;word-break:break-all}
.fill-field input{width:100%;padding:9px 12px;border:1.5px solid var(--line);border-radius:9px;font-size:14px;font-family:inherit;outline:none;color:var(--ink);background:var(--bg)}
.fill-field input:focus{border-color:var(--blue)}
.fill-prevwrap{margin-top:14px}
.fill-prevwrap label{display:block;font-size:12px;font-weight:800;color:var(--teal);margin-bottom:6px}
#fillprev{background:var(--code);color:#e8f0f7;border-radius:10px;padding:13px 15px;font-family:inherit;font-size:13px;line-height:1.62;white-space:pre-wrap;word-break:break-word;max-height:230px;overflow-y:auto}
.fill-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 20px;border-top:1px solid var(--line);flex-wrap:wrap}
.fill-remember{font-size:12px;color:var(--sub);display:flex;align-items:center;gap:6px;cursor:pointer}
#fillcopy{background:var(--teal);color:#fff;border:none;border-radius:9px;padding:10px 20px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
#fillcopy:hover{background:#0b7d72}
.dark .fill-head b{color:#e6eef6}
/* category filter */
.catfilter{display:flex;flex-wrap:wrap;gap:6px;margin:11px 0 2px;align-items:center}
.catfilter>span{font-size:10.5px;color:var(--sub);font-weight:800;letter-spacing:.5px}
.catfilter button{background:#eef4fb;border:1px solid var(--line);color:var(--blue);border-radius:99px;padding:4px 10px;font-size:11.5px;font-weight:600;cursor:pointer;font-family:inherit}
.catfilter button:hover{background:var(--blue);color:#fff}
.catfilter button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.dark .catfilter button{background:#15202c;border-color:#2b3c4d;color:#5b9bf0}
.dark .catfilter button.on{background:#5b9bf0;color:#0e1621;border-color:#5b9bf0}
@media(max-width:1023px){.catfilter{display:none}}
/* search highlight */
mark{background:#ffe08a;color:#3a2c00;border-radius:3px;padding:0 2px}
.dark mark{background:#6d5410;color:#ffe6a0}
/* deep-link flash */
@keyframes flashcard{0%,100%{box-shadow:0 0 0 3px rgba(245,166,35,0)}12%{box-shadow:0 0 0 3px rgba(245,166,35,.85)}}
.p.flash,.ch.flash{animation:flashcard 2.2s ease-out;border-radius:14px}
.p .n{cursor:pointer}
.p .n:hover{background:var(--teal)}
/* version chip */
.eyebrow.ver{margin-left:8px;background:rgba(125,216,204,.14);border-color:rgba(125,216,204,.4);color:#a7e8dd}

/* theme switch (override old floating #theme) */
#theme{position:static;left:auto;bottom:auto;z-index:auto;box-shadow:none;display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin:12px 0 6px;padding:8px 12px;background:#f4f7fa;color:var(--ink);border:1px solid var(--line);border-radius:10px;cursor:pointer;font-family:inherit;font-size:13px;font-weight:700}
#theme:hover{background:#eaf0f6}
#theme .tt-label{font-size:13px;font-weight:700}
#theme .tt-track{width:40px;height:22px;border-radius:99px;background:#cdd9e4;position:relative;transition:background .2s;flex-shrink:0}
#theme .tt-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.28);transition:left .2s}
#theme.on .tt-track{background:var(--teal)}
#theme.on .tt-knob{left:20px}
.dark #theme{background:#131c26;color:#e6eef6;border-color:#28343f}
.dark #theme:hover{background:#18232f}
.dark #theme .tt-track{background:#2b3c4d}
/* TOC title row */
.mt-titlerow{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap}
.mt-titlerow .mt-exp{margin-top:0}
/* accessibility */
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.p.flash,.ch.flash{animation:none}.toast{transition:opacity .01s}#theme .tt-knob,#theme .tt-track{transition:none}}

/* brand row + small dark toggle */
.brandrow{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:14px}
.brandrow .brand{margin-bottom:0}
#theme{position:static;left:auto;bottom:auto;z-index:auto;margin:3px 0 0;padding:0;width:auto;background:none;border:none;box-shadow:none;flex-shrink:0;display:inline-flex;align-items:center}
#theme:hover{background:none}
#theme .tt-track{width:34px;height:19px;border-radius:99px;background:#cdd9e4;position:relative;transition:background .2s}
#theme .tt-knob{position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.28);transition:left .2s}
#theme.on .tt-track{background:var(--teal)}
#theme.on .tt-knob{left:17px}
.dark #theme{background:none}
.dark #theme:hover{background:none}
.dark #theme .tt-track{background:#2b3c4d}
/* per-prompt share button */
.sharep{background:#2d5378;color:#dbe9f5;border:none;font-size:12px;font-weight:600;padding:4px 11px;border-radius:6px;cursor:pointer;font-family:inherit}
.sharep:hover{background:var(--blue);color:#fff}

/* card header actions (fill/share/star grouped, light styling) */
.p h4{flex-wrap:wrap}
.cardacts{display:flex;align-items:center;gap:6px;margin-left:auto;flex-shrink:0}
.cardacts .fav{margin-left:0}
.cardacts .fillbtn,.cardacts .sharep{background:#eef4fb;color:var(--blue);border:1px solid var(--line);font-size:12px;font-weight:600;padding:3px 10px;border-radius:7px;cursor:pointer;font-family:inherit}
.cardacts .fillbtn:hover,.cardacts .sharep:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.dark .cardacts .fillbtn,.dark .cardacts .sharep{background:#15202c;border-color:#2b3c4d;color:#5b9bf0}
.dark .cardacts .fillbtn:hover,.dark .cardacts .sharep:hover{background:#5b9bf0;color:#0e1621;border-color:#5b9bf0}
/* dark toggle label (small) */
#theme{gap:6px}
#theme .tt-label{font-size:11px;font-weight:700;color:var(--sub);white-space:nowrap}
.dark #theme .tt-label{color:#9fb1c1}

/* section-label style (not a fill variable) */
.phdr{color:#9fb8cc;font-weight:700}
.dark .phdr{color:#7d93a8}
/* profile access + save */
.fill-head-actions{display:flex;align-items:center;gap:10px}
.fill-head .openprofile{background:#eef4fb;color:var(--blue);border:1px solid var(--line);font-size:12px;font-weight:700;padding:5px 12px;border-radius:8px;cursor:pointer;font-family:inherit}
.fill-head .openprofile:hover{background:var(--blue);color:#fff}
.dark .fill-head .openprofile{background:#15202c;border-color:#2b3c4d;color:#5b9bf0}
#profilesave{background:var(--teal);color:#fff;border:none;border-radius:9px;padding:10px 22px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
#profilesave:hover{background:#0b7d72}
.fill-field.autofilled input{border-color:var(--teal);background:rgba(14,148,136,.06)}
.fill-field.autofilled label::after{content:' · 내 병원 정보';color:var(--teal);font-weight:600;font-size:11px}
.dark .fill-field.autofilled input{background:rgba(125,216,204,.08)}

/* onboarding */
.onboard{margin-top:26px}
.onboard-inner{position:relative;background:linear-gradient(120deg,#eef6ff,#eafaf7);border:1px solid var(--tipline);border-radius:16px;padding:20px 24px}
#onboardclose{position:absolute;top:12px;right:14px;background:none;border:none;font-size:16px;color:var(--sub);cursor:pointer;line-height:1}
.onboard-inner>b{display:block;font-size:16px;color:var(--navy);margin-bottom:12px}
.onboard-list{list-style:none;display:grid;gap:8px;margin:0 0 16px;padding:0}
.onboard-list li{font-size:14px;color:#3d5266;line-height:1.55}
.onboard-list li b{color:var(--blue)}
#onboardok{background:var(--navy);color:#fff;border:none;border-radius:9px;padding:9px 20px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
#onboardok:hover{background:var(--blue)}
.dark .onboard-inner{background:linear-gradient(120deg,#16212e,#12241f);border-color:#20463f}
.dark .onboard-inner>b{color:#e6eef6}
.dark .onboard-list li{color:#c3d2df}