:root{
  --bg:#07111f;
  --panel:#0c1829;
  --panel2:#10213a;
  --ink:#eaf2ff;
  --muted:#91a4bf;
  --line:rgba(255,255,255,.12);
  --accent:#46d5c7;
  --accent2:#6aa7ff;
  --danger:#ff6b6b;
  --warn:#ffc857;
  --good:#79e08e;
  --selected:#66fff2;
  --shadow:0 18px 42px rgba(0,0,0,.35);
  --radius:22px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:"Segoe UI",Roboto,"Noto Sans KR",Arial,sans-serif;
  background:radial-gradient(circle at top left,#183b66 0,#07111f 38%,#050912 100%);
  color:var(--ink);
  overflow:hidden;
}
button,input,textarea{font:inherit}
button{cursor:pointer;border:0;color:inherit}
.app{
  height:100dvh;
  min-height:0;
  display:grid;
  grid-template-columns:330px minmax(420px,1fr) 470px;
  grid-template-rows:auto auto minmax(0,1fr);
  gap:16px;
  padding:14px 18px 18px;
}
.header{
  grid-column:1/4;
  display:flex;
  gap:12px;
  align-items:center;
  min-height:74px;
  background:linear-gradient(135deg,rgba(70,213,199,.16),rgba(106,167,255,.10));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:14px 16px;
}
.logo{
  width:48px;height:48px;border-radius:16px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  display:grid;place-items:center;color:#04101c;font-weight:900;font-size:22px;
  box-shadow:0 10px 26px rgba(70,213,199,.22);
}
.h-title{flex:1;min-width:0}
.h-title h1{font-size:22px;margin:0 0 4px;letter-spacing:-.03em}
.h-title p{margin:0;color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search{flex:1.15;display:flex;gap:8px;background:rgba(255,255,255,.08);border:1px solid var(--line);border-radius:18px;padding:8px}
.search input{width:100%;background:transparent;border:0;outline:0;color:var(--ink);font-size:18px}
.pill{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.09);border:1px solid var(--line);white-space:nowrap}
.pill.primary{background:linear-gradient(135deg,rgba(70,213,199,.95),rgba(106,167,255,.95));color:#04101c;font-weight:800}
.pill.warn{background:rgba(255,200,87,.16);border-color:rgba(255,200,87,.35)}
.pill.danger{background:rgba(255,107,107,.18);border-color:rgba(255,107,107,.35)}
.mobile-tabs{display:none}
.side,.main,.detail{
  min-height:0;
  background:rgba(12,24,41,.86);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.side{grid-column:1;grid-row:3}
.main{grid-column:2;grid-row:3}
.detail{grid-column:3;grid-row:3}
.section-title{padding:16px 16px 8px;font-size:13px;font-weight:900;color:#b8c7dd;letter-spacing:.08em;text-transform:uppercase}
.filters{padding:0 14px 14px;display:grid;gap:9px;overflow:auto;scrollbar-color:var(--accent) rgba(255,255,255,.08);scrollbar-width:thin}
.filter-btn{width:100%;text-align:left;padding:13px 14px;border-radius:16px;background:rgba(255,255,255,.065);border:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px;transition:.16s}
.filter-btn.active{
  background:linear-gradient(135deg,rgba(70,213,199,.35),rgba(106,167,255,.20));
  border-color:rgba(102,255,242,.9);
  box-shadow:inset 5px 0 0 var(--selected),0 0 0 1px rgba(102,255,242,.18);
  color:#f6ffff;
}
.count{color:var(--muted);font-size:12px}
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.quick-grid .filter-btn{font-size:13px;padding:12px 10px}
.hintbox{margin:0 14px 14px;padding:13px;border-radius:16px;background:rgba(255,200,87,.10);border:1px solid rgba(255,200,87,.25);font-size:13px;color:#ffe0a1;line-height:1.45}
.toolbar{padding:14px;display:flex;gap:8px;align-items:center;border-bottom:1px solid var(--line);flex-wrap:wrap}
.toolbar .pill{font-size:13px;padding:9px 10px}
.cards{padding:14px;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:12px;align-content:start;scrollbar-color:var(--accent) rgba(255,255,255,.08);scrollbar-width:thin}
.card{background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.045));border:1px solid var(--line);border-radius:20px;padding:14px;min-height:180px;display:flex;flex-direction:column;gap:10px;transition:.16s transform,.16s border,.16s background}
.card:hover{transform:translateY(-2px);border-color:rgba(106,167,255,.50)}
.card.selected{
  border-color:rgba(102,255,242,.95);
  background:linear-gradient(180deg,rgba(70,213,199,.18),rgba(106,167,255,.075));
  box-shadow:0 0 0 2px rgba(70,213,199,.18),0 18px 32px rgba(0,0,0,.32);
}
.card.selected .qid,.card.selected .qtext{color:#f6ffff}
.card.selected .qid::after{content:" 선택됨";font-size:11px;margin-left:8px;color:#04101c;background:var(--selected);border-radius:999px;padding:4px 7px;vertical-align:middle}
.tags{display:flex;gap:6px;flex-wrap:wrap}
.tag{font-size:11px;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.08);color:#c6d8ef;border:1px solid var(--line)}
.tag.lv4{background:rgba(255,107,107,.15);color:#ffd6d6}
.tag.lv3{background:rgba(255,200,87,.13);color:#ffe2a6}
.tag.top{background:rgba(70,213,199,.17);color:#bff8f1}
.qid{font-size:18px;font-weight:900}
.qtext{font-size:16px;line-height:1.35;font-weight:800;letter-spacing:-.025em}
.mini{color:var(--muted);font-size:13px;line-height:1.45}
.defense{margin-top:auto;color:#b8f8f0;font-size:13px;line-height:1.35}
.empty{padding:50px 20px;text-align:center;color:var(--muted)}
.detail-header{padding:18px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.03));flex:0 0 auto}
.detail h2{margin:8px 0 0;font-size:24px;line-height:1.28;letter-spacing:-.04em}
.detail-body{padding:16px;overflow:auto;display:grid;gap:14px;min-height:0;scrollbar-color:var(--accent) rgba(255,255,255,.08);scrollbar-width:thin}
.answer-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;position:sticky;top:0;z-index:2;background:rgba(12,24,41,.96);padding-bottom:4px}
.answer-tabs button{padding:12px 8px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid var(--line);font-size:13px;font-weight:800}
.answer-tabs button.active{background:linear-gradient(135deg,rgba(70,213,199,.95),rgba(106,167,255,.95));color:#061323;box-shadow:0 0 0 2px rgba(102,255,242,.20)}
.answer-box{background:#f8fbff;color:#111827;border-radius:18px;padding:18px;font-size:19px;line-height:1.52;font-weight:700;white-space:pre-wrap;box-shadow:0 12px 26px rgba(0,0,0,.25);max-height:none;overflow:visible}
.answer-box.detailText{font-size:16px;font-weight:500}
.copy-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.copy-row button{padding:12px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid var(--line)}
.info-panel{background:rgba(255,255,255,.055);border:1px solid var(--line);border-radius:18px;padding:14px}
.info-panel h3{font-size:14px;margin:0 0 8px;color:#cfe1f9}
.info-panel p{margin:0;color:#dce8f7;line-height:1.5;font-size:14px}
.risk-list{display:grid;gap:8px}
.risk-item{padding:10px;border-radius:14px;background:rgba(255,107,107,.10);border:1px solid rgba(255,107,107,.20);font-size:13px;line-height:1.42}
.risk-item b{color:#ffbaba}
.evidence-buttons{display:grid;gap:8px;margin-top:10px}
.evidence-rule{font-size:12px!important;color:#b8c7dd!important;margin-bottom:8px!important}
.evidence-btn{width:100%;text-align:left;border:1px solid rgba(70,213,199,.22);background:linear-gradient(135deg,rgba(70,213,199,.12),rgba(106,167,255,.07));border-radius:16px;padding:12px;display:grid;gap:5px;transition:.16s}
.evidence-btn:hover,.evidence-btn.active{border-color:rgba(102,255,242,.85);box-shadow:inset 4px 0 0 var(--selected);background:linear-gradient(135deg,rgba(70,213,199,.22),rgba(106,167,255,.12))}
.evidence-btn b{font-size:14px;color:#eaf2ff}
.evidence-btn span{font-size:12px;color:#bff8f1}
.evidence-btn em{font-size:12px;color:#9fb2cc;font-style:normal;line-height:1.35}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(20px);background:#101b2b;color:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:14px;padding:12px 16px;opacity:0;pointer-events:none;transition:.2s;z-index:50}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;padding:18px;z-index:30}
.modal.show{display:flex}
.modal-card{width:min(840px,96vw);max-height:86vh;overflow:auto;background:#0c1829;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:18px;scrollbar-color:var(--accent) rgba(255,255,255,.08);scrollbar-width:thin}
.modal-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.modal-head h2{margin:0;flex:1}
.list{display:grid;gap:10px}
.list-item{background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:16px;padding:13px;line-height:1.45}
.install-tip{font-size:12px;color:#93a9c5;margin-top:6px}
.evidence-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:.22s opacity;z-index:20}
.evidence-drawer{position:fixed;right:0;top:0;width:min(820px,94vw);height:100dvh;background:#07111f;border-left:1px solid rgba(255,255,255,.14);box-shadow:-22px 0 50px rgba(0,0,0,.42);transform:translateX(104%);transition:.24s transform;z-index:21;display:flex;flex-direction:column;min-height:0}
.evidence-open .evidence-backdrop{opacity:1;pointer-events:auto}
.evidence-open .evidence-drawer{transform:translateX(0)}
.evidence-head{display:flex;gap:12px;align-items:flex-start;padding:16px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,rgba(70,213,199,.16),rgba(106,167,255,.08));flex:0 0 auto}
.evidence-head h2{font-size:21px;margin:0 0 6px;letter-spacing:-.03em;line-height:1.25}
.evidence-head p{font-size:13px;color:#b8c7dd;margin:0;line-height:1.45}
.evidence-head .pill{margin-left:auto}
.evidence-body{padding:14px;overflow:auto;display:grid;gap:14px;min-height:0;scrollbar-color:var(--accent) rgba(255,255,255,.08);scrollbar-width:thin}
.evidence-summary,.drawer-answer,.drawer-evidence-meta{padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid var(--line);color:#dce8f7;line-height:1.5}
.drawer-answer h3,.drawer-evidence-meta h3{font-size:14px;margin:0 0 8px;color:#bff8f1}
.drawer-answer p,.drawer-evidence-meta p{margin:0;white-space:pre-wrap}
.evidence-actions{display:flex;gap:8px;flex-wrap:wrap}
.evidence-actions a{text-decoration:none}
.pdf-page{margin:0;background:rgba(255,255,255,.055);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.pdf-page figcaption{padding:10px 12px;font-size:13px;font-weight:800;color:#bff8f1;background:rgba(70,213,199,.08);border-bottom:1px solid var(--line)}
.pdf-page img{display:block;width:100%;height:auto;background:white}
::-webkit-scrollbar{width:13px;height:13px}
::-webkit-scrollbar-track{background:rgba(255,255,255,.055);border-radius:999px}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--accent),var(--accent2));border-radius:999px;border:3px solid rgba(7,17,31,.75)}
@media(max-width:1180px){
  body{overflow:auto}
  .app{grid-template-columns:1fr;grid-template-rows:auto auto auto auto auto;height:auto;min-height:100dvh;overflow:visible}
  .header,.mobile-tabs,.side,.main,.detail{grid-column:1}
  .header{flex-wrap:wrap}
  .search{order:10;flex-basis:100%}
  .side{grid-row:3;min-height:360px}
  .main{grid-row:4;min-height:520px}
  .detail{grid-row:5;min-height:620px}
  .filters{max-height:450px}
  .cards{grid-template-columns:1fr}
  .answer-tabs{grid-template-columns:1fr 1fr}
  .copy-row{grid-template-columns:1fr}
}
@media (max-width:900px) and (orientation:portrait), (max-width:760px){
  body{overflow:hidden}
  .app{height:100dvh;padding:10px;gap:10px;grid-template-rows:auto auto minmax(0,1fr);grid-template-columns:1fr}
  .header{grid-row:1;min-height:auto;padding:10px;border-radius:18px;gap:8px}
  .logo{width:40px;height:40px;border-radius:13px}
  .h-title h1{font-size:18px}
  .h-title p{font-size:11px}
  .search{order:2;flex-basis:100%;padding:7px;border-radius:14px}
  .search input{font-size:16px}
  .header>.pill{padding:8px 9px;font-size:12px}
  .mobile-tabs{grid-row:2;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:rgba(12,24,41,.92);border:1px solid var(--line);border-radius:18px;padding:8px;box-shadow:var(--shadow)}
  .mobile-tabs button{padding:11px 8px;border-radius:13px;background:rgba(255,255,255,.08);border:1px solid var(--line);font-weight:900;font-size:13px}
  body.pane-side .mobile-tabs button[data-pane="side"],
  body.pane-main .mobile-tabs button[data-pane="main"],
  body.pane-detail .mobile-tabs button[data-pane="detail"]{background:linear-gradient(135deg,rgba(70,213,199,.95),rgba(106,167,255,.95));color:#061323}
  .side,.main,.detail{grid-row:3;display:none;border-radius:18px;min-height:0;height:100%;overflow:hidden}
  body.pane-side .side{display:flex}
  body.pane-main .main{display:flex}
  body.pane-detail .detail{display:flex}
  .quick-grid{grid-template-columns:1fr 1fr}
  .section-title{padding:12px 14px 7px}
  .hintbox{font-size:12px;margin:0 12px 10px}
  .filters{padding:0 12px 12px;gap:8px}
  .filter-btn{padding:12px 13px}
  .toolbar{padding:10px;gap:6px}
  .toolbar .pill{font-size:12px;padding:8px}
  .cards{padding:10px;grid-template-columns:1fr;gap:10px}
  .card{min-height:150px;padding:12px;border-radius:17px}
  .qtext{font-size:15px}
  .mini,.defense{font-size:12px}
  .detail-header{padding:12px}
  .detail h2{font-size:19px}
  .detail-body{padding:10px;gap:10px}
  .answer-tabs{grid-template-columns:repeat(4,1fr);gap:6px}
  .answer-tabs button{font-size:12px;padding:10px 4px}
  .answer-box{font-size:17px;padding:14px;border-radius:16px}
  .info-panel{padding:12px;border-radius:16px}
  .evidence-drawer{width:100vw}
  .evidence-head{position:sticky;top:0;z-index:1;padding:12px}
  .evidence-head h2{font-size:18px}
  .evidence-head p{font-size:12px}
  .evidence-body{padding:10px;gap:10px}
  .pdf-page{border-radius:14px}
  .pdf-page figcaption{font-size:12px;padding:9px 10px}
}
.print-only{display:none}
@media print{
  body{background:white;color:black;overflow:visible}
  .app{display:block;height:auto}
  .header,.mobile-tabs,.side,.toolbar,.detail{display:none}
  .main{box-shadow:none;border:0}
  .cards{display:block;overflow:visible}
  .card{break-inside:avoid;margin-bottom:12px;color:black;border:1px solid #999;background:white}
  .tag,.mini,.defense{color:#333;background:white}
}

/* v4 focus evidence drawer: question/answer first, 원문 해당 부분 우선 표시 */
.evidence-head > div{flex:1;min-width:0}
.evidence-head-answer{margin-top:10px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.10);border:1px solid rgba(70,213,199,.22);color:#eef8ff;line-height:1.48;font-size:14px;max-height:22dvh;overflow:auto;scrollbar-color:var(--accent) rgba(255,255,255,.08);scrollbar-width:thin;white-space:pre-wrap}
.evidence-head-answer b{color:#bff8f1}
.drawer-current-qa{padding:14px 16px;border-radius:18px;background:linear-gradient(135deg,rgba(70,213,199,.14),rgba(106,167,255,.08));border:1px solid rgba(70,213,199,.24);color:#eff8ff;line-height:1.55;box-shadow:0 12px 22px rgba(0,0,0,.18)}
.drawer-current-qa h3{font-size:14px;margin:0 0 7px;color:#bff8f1}
.drawer-current-qa h3:not(:first-child){margin-top:12px}
.drawer-current-qa p{margin:0;white-space:pre-wrap;font-size:15px;font-weight:700}
.drawer-current-qa .drawer-question{font-size:17px;font-weight:900;letter-spacing:-.025em}
.drawer-evidence-meta.compact{background:rgba(255,255,255,.045)}
.evidence-actions.only-copy{justify-content:flex-end}
.evidence-section{display:grid;gap:10px;padding:12px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.035)}
.evidence-section h3{margin:0;font-size:15px;color:#bff8f1}
.evidence-section p{margin:0;color:#aebed5;font-size:13px;line-height:1.45}
.pdf-page.focus-page{border-color:rgba(255,196,87,.48);box-shadow:0 0 0 1px rgba(255,196,87,.24),0 14px 28px rgba(0,0,0,.18)}
.pdf-page.focus-page figcaption{color:#fff1be;background:rgba(255,196,87,.16)}
.pdf-page.full-page{margin-top:4px}
.pdf-page img{object-fit:contain;max-width:100%;height:auto}
@media (max-width:900px) and (orientation:portrait), (max-width:760px){
  .evidence-head-answer{max-height:18dvh;font-size:13px;padding:9px 10px}
  .drawer-current-qa p{font-size:14px}
  .drawer-current-qa .drawer-question{font-size:15px}
  .evidence-section{padding:9px;border-radius:14px}
}


/* v5: evidence drawer body is pure scrollable PDF area; no duplicate Q/A/meta below header */
.evidence-body{flex:1 1 auto!important;overflow-y:auto!important;overflow-x:hidden!important;align-content:start;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
.evidence-section{gap:8px!important;}
.evidence-region-section{border-color:rgba(255,196,87,.35);background:rgba(255,196,87,.045);}
.evidence-page-section{background:rgba(255,255,255,.025);}
.evidence-section > h3{position:sticky;top:-14px;z-index:2;background:#07111f;padding:9px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.10);}
.pdf-page img{width:100%;height:auto;display:block;}
@media (max-width:900px) and (orientation:portrait), (max-width:760px){
  .evidence-body{height:auto!important;max-height:none!important;padding:8px!important;}
  .evidence-section > h3{top:-8px;font-size:13px;}
}


/* v6: evidence PDF entry is always visible directly under the selected answer */
.evidence-quick{display:block;margin-top:-2px;}
.evidence-quick:empty{display:none;}
.evidence-quick-title{font-size:13px;font-weight:900;color:#bff8f1;margin:0 0 8px;padding-left:2px;letter-spacing:-.02em;}
.evidence-quick-buttons{display:grid;gap:9px;}
.evidence-primary{width:100%;text-align:left;border:1px solid rgba(70,213,199,.42);background:linear-gradient(135deg,rgba(70,213,199,.22),rgba(106,167,255,.12));border-radius:18px;padding:14px 16px;display:grid;gap:4px;box-shadow:0 12px 22px rgba(0,0,0,.18), inset 5px 0 0 rgba(70,213,199,.95);cursor:pointer;}
.evidence-primary:hover,.evidence-primary.active{border-color:rgba(102,255,242,.9);background:linear-gradient(135deg,rgba(70,213,199,.34),rgba(106,167,255,.18));transform:translateY(-1px);}
.evidence-primary .ep-label{font-size:12px;color:#061323;background:linear-gradient(135deg,var(--accent),var(--accent2));font-weight:900;border-radius:999px;padding:4px 8px;width:max-content;margin-bottom:2px;}
.evidence-primary b{font-size:16px;color:#f2fbff;line-height:1.25;}
.evidence-primary em{font-size:12px;color:#c7f8f3;font-style:normal;line-height:1.35;}
.evidence-primary.disabled{opacity:.45;cursor:not-allowed;box-shadow:none;}
#evidencePanel:empty{display:none;}
/* drawer should reveal PDF immediately below the sticky Q/A header */
.evidence-drawer{overflow:hidden!important;}
.evidence-head{max-height:42dvh;overflow:auto;}
.evidence-body{background:#07111f;}
@media (min-width:901px){
  .evidence-drawer{width:min(920px,55vw)!important;}
}
@media (max-width:900px) and (orientation:portrait), (max-width:760px){
  .evidence-primary{padding:12px 13px;border-radius:15px;}
  .evidence-primary b{font-size:14px;}
  .evidence-head{max-height:38dvh;}
}

.pill.upgrade{border-color:rgba(70,213,199,.55);background:rgba(70,213,199,.12);color:#bff8f1}
.pill.upgrade:disabled{opacity:.6;cursor:wait}

/* page reverse question response drawer */
.pill.pagebtn{background:rgba(70,213,199,.13);border-color:rgba(70,213,199,.35);font-weight:900}
.page-map-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.48);opacity:0;pointer-events:none;transition:.22s opacity;z-index:24}
.page-map-drawer{position:fixed;right:0;top:0;width:min(1100px,96vw);height:100dvh;background:#07111f;border-left:1px solid rgba(255,255,255,.15);box-shadow:-24px 0 55px rgba(0,0,0,.46);transform:translateX(104%);transition:.24s transform;z-index:25;display:flex;flex-direction:column;min-height:0}
.page-map-open .page-map-backdrop{opacity:1;pointer-events:auto}
.page-map-open .page-map-drawer{transform:translateX(0)}
.page-map-head{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,rgba(70,213,199,.16),rgba(106,167,255,.08));flex:0 0 auto}
.page-map-head>div{flex:1;min-width:0}.page-map-head h2{margin:0 0 6px;font-size:22px;letter-spacing:-.03em}.page-map-head p{margin:0;color:#b8c7dd;font-size:13px;line-height:1.45}.page-map-head .pill{margin-left:auto}
.page-map-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 14px;background:rgba(255,255,255,.035);border-bottom:1px solid var(--line)}
.page-map-tabs button{padding:12px 10px;border-radius:15px;background:rgba(255,255,255,.08);border:1px solid var(--line);font-weight:900}
.page-map-tabs button.active{background:linear-gradient(135deg,rgba(70,213,199,.95),rgba(106,167,255,.95));color:#061323;box-shadow:0 0 0 2px rgba(102,255,242,.18)}
.page-map-body{padding:14px;overflow:auto;min-height:0;display:grid;gap:12px;scrollbar-color:var(--accent) rgba(255,255,255,.08);scrollbar-width:thin}
.page-map-control{display:grid;grid-template-columns:150px auto 1fr;gap:10px;align-items:center;position:sticky;top:0;z-index:2;background:rgba(7,17,31,.96);padding:0 0 8px}
.page-map-control input{background:rgba(255,255,255,.09);border:1px solid var(--line);border-radius:14px;padding:12px;color:var(--ink);outline:0;font-size:16px}
.page-map-rule{color:#b8c7dd;font-size:13px;line-height:1.4}
.page-map-quick{display:flex;gap:7px;flex-wrap:wrap;padding-bottom:2px}
.page-map-quick button{border:1px solid var(--line);background:rgba(255,255,255,.07);border-radius:999px;padding:8px 10px;font-size:12px;color:#dce8f7}
.page-map-quick button.active{background:rgba(70,213,199,.28);border-color:rgba(102,255,242,.8);color:#f7ffff;font-weight:900}
.page-map-content{display:grid;gap:14px}
.page-map-current{padding:14px 16px;border-radius:20px;border:1px solid var(--line);background:linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.035));display:grid;gap:10px}
.page-map-current.proposal{border-color:rgba(70,213,199,.26)}.page-map-current.presentation{border-color:rgba(106,167,255,.34)}
.pm-meta{display:flex;gap:7px;flex-wrap:wrap}.pm-meta span{font-size:12px;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid var(--line);color:#cfe1f9}.pm-meta span:nth-child(2){color:#bff8f1;background:rgba(70,213,199,.12)}
.page-map-current h3{font-size:21px;margin:0;letter-spacing:-.03em}.pm-explain{margin:0;color:#aebed5;line-height:1.5}.pm-frame{padding:12px 13px;border-radius:15px;background:rgba(70,213,199,.10);border:1px solid rgba(70,213,199,.23);line-height:1.55;color:#eff8ff}.pm-frame b{color:#bff8f1}
.pm-attacks{display:flex;gap:7px;flex-wrap:wrap}.pm-attacks span{font-size:12px;color:#ffe2a6;background:rgba(255,200,87,.12);border:1px solid rgba(255,200,87,.24);border-radius:999px;padding:6px 9px}
.page-map-layout{display:grid;gap:14px;align-items:start}.page-map-layout.proposal{grid-template-columns:minmax(360px,0.8fr) minmax(420px,1fr)}.page-map-layout.presentation{grid-template-columns:minmax(520px,1.05fr) minmax(380px,0.95fr)}
.page-preview{margin:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:rgba(255,255,255,.055);position:sticky;top:62px}.page-preview figcaption{padding:10px 12px;font-size:13px;font-weight:900;color:#bff8f1;background:rgba(70,213,199,.08);border-bottom:1px solid var(--line)}.page-preview img{display:block;width:100%;height:auto;background:#fff}
.page-related{display:grid;gap:10px}.page-related h3{font-size:16px;margin:0;color:#cfe1f9}.reverse-q-card{display:grid;gap:8px;padding:12px;border-radius:17px;background:rgba(255,255,255,.06);border:1px solid var(--line);transition:.15s}.reverse-q-card:hover,.reverse-q-card.active{border-color:rgba(102,255,242,.88);box-shadow:inset 4px 0 0 var(--selected);background:linear-gradient(135deg,rgba(70,213,199,.14),rgba(106,167,255,.06))}.rq-top{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.rq-top b{font-size:15px}.rq-top span{font-size:11px;padding:4px 7px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid var(--line);color:#c6d8ef}.rq-question{font-weight:900;line-height:1.38;letter-spacing:-.02em}.rq-answer{font-size:13px;line-height:1.45;color:#b8c7dd}.reverse-q-card button{justify-self:start;padding:8px 10px;border-radius:12px;background:rgba(70,213,199,.16);border:1px solid rgba(70,213,199,.28);font-size:12px;font-weight:900;color:#dffefa}.empty.small{font-size:13px;padding:18px;color:#91a4bf;border:1px dashed var(--line);border-radius:16px}
@media(max-width:1180px){.page-map-drawer{width:100vw}.page-map-layout.proposal,.page-map-layout.presentation{grid-template-columns:1fr}.page-preview{position:relative;top:0}.page-map-control{grid-template-columns:1fr auto}.page-map-rule{grid-column:1/-1}}
@media (max-width:900px) and (orientation:portrait), (max-width:760px){.page-map-head{padding:12px}.page-map-head h2{font-size:18px}.page-map-head p{font-size:12px}.page-map-tabs{padding:9px}.page-map-tabs button{padding:10px 8px;font-size:13px}.page-map-body{padding:10px}.page-map-control{grid-template-columns:1fr auto;gap:8px}.page-map-control input{font-size:14px;padding:10px}.page-map-current{padding:11px;border-radius:16px}.page-map-current h3{font-size:17px}.pm-explain,.pm-frame{font-size:13px}.page-preview{border-radius:14px}.reverse-q-card{border-radius:15px;padding:11px}.rq-question{font-size:14px}.rq-answer{font-size:12px}}

/* main 3-tab layout: questions / presentation / proposal */
.app{grid-template-rows:auto auto auto minmax(0,1fr)}
.mode-tabs{grid-column:1/4;grid-row:2;display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:12px;background:rgba(12,24,41,.72);border:1px solid var(--line);border-radius:20px;padding:10px;box-shadow:var(--shadow)}
.mode-tabs button{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:18px;padding:15px 16px;font-size:18px;font-weight:1000;letter-spacing:-.02em;background:rgba(255,255,255,.065);color:#dce8f7;transition:.15s transform,.15s border,.15s background}
.mode-tabs button:hover{transform:translateY(-1px)}
.mode-tabs button.active{color:#03111c;box-shadow:0 0 0 2px rgba(255,255,255,.12),0 14px 28px rgba(0,0,0,.26)}
.mode-tabs .qna-tab.active{background:linear-gradient(135deg,#46d5c7,#6aa7ff)}
.mode-tabs .presentation-tab.active{background:linear-gradient(135deg,#b68cff,#ffb86b)}
.mode-tabs .proposal-tab.active{background:linear-gradient(135deg,#7ee787,#46d5c7)}
.mode-tabs button::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:transparent}.mode-tabs .qna-tab::before{background:#46d5c7}.mode-tabs .presentation-tab::before{background:#b68cff}.mode-tabs .proposal-tab::before{background:#7ee787}
.side,.main,.detail,.doc-workspace{grid-row:4}.doc-workspace{grid-column:1/4;min-height:0;background:rgba(12,24,41,.88);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;display:none;flex-direction:column}
body.tab-qna .side,body.tab-qna .main,body.tab-qna .detail{display:flex}body.tab-presentation .side,body.tab-presentation .main,body.tab-presentation .detail,body.tab-proposal .side,body.tab-proposal .main,body.tab-proposal .detail{display:none}body.tab-presentation .doc-workspace,body.tab-proposal .doc-workspace{display:flex}
body.tab-presentation .mobile-tabs,body.tab-proposal .mobile-tabs{display:none!important}
body.theme-qna{--accent:#46d5c7;--accent2:#6aa7ff;--selected:#66fff2;background:radial-gradient(circle at top left,#183b66 0,#07111f 38%,#050912 100%)}
body.theme-presentation{--accent:#b68cff;--accent2:#ffb86b;--selected:#ffcc8a;background:radial-gradient(circle at top left,#462d68 0,#0d1022 39%,#050912 100%)}
body.theme-proposal{--accent:#7ee787;--accent2:#46d5c7;--selected:#b5ffcf;background:radial-gradient(circle at top left,#1e5132 0,#071c1f 39%,#050912 100%)}
body.theme-presentation .header{background:linear-gradient(135deg,rgba(182,140,255,.18),rgba(255,184,107,.11))}body.theme-proposal .header{background:linear-gradient(135deg,rgba(126,231,135,.17),rgba(70,213,199,.11))}
.doc-work-head{display:flex;align-items:flex-start;gap:14px;padding:17px 20px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.035));flex:0 0 auto}.doc-work-head h2{font-size:25px;letter-spacing:-.04em;margin:0 0 4px}.doc-work-head p{margin:0;color:var(--muted);line-height:1.45}.doc-work-body{padding:15px;display:grid;gap:13px;overflow:auto;min-height:0;scrollbar-color:var(--accent) rgba(255,255,255,.08);scrollbar-width:thin}.doc-work-control{display:grid;grid-template-columns:170px auto 1fr;gap:10px;align-items:center;position:sticky;top:0;z-index:3;background:rgba(7,17,31,.96);padding:0 0 9px}.doc-work-control input{background:rgba(255,255,255,.09);border:1px solid var(--line);border-radius:15px;padding:13px;color:var(--ink);outline:0;font-size:17px}.doc-page-rule{font-size:13px;color:#b8c7dd;line-height:1.4}.doc-page-quick{display:flex;gap:8px;flex-wrap:wrap}.doc-page-quick button{border:1px solid var(--line);background:rgba(255,255,255,.07);border-radius:999px;padding:8px 11px;font-size:12px;color:#dce8f7}.doc-page-quick button.active{background:color-mix(in srgb,var(--accent) 28%,transparent);border-color:var(--accent);font-weight:900;color:#fff}.doc-page-content{display:grid;gap:14px}
body.theme-presentation .page-map-current{border-color:rgba(182,140,255,.34)}body.theme-presentation .pm-meta span:nth-child(2){color:#ffe4c2;background:rgba(255,184,107,.14)}body.theme-presentation .pm-frame{background:rgba(182,140,255,.10);border-color:rgba(182,140,255,.24)}body.theme-presentation .pm-frame b,body.theme-presentation .page-preview figcaption{color:#ffe4c2}body.theme-presentation .page-preview figcaption{background:rgba(182,140,255,.10)}body.theme-proposal .page-map-current{border-color:rgba(126,231,135,.34)}body.theme-proposal .pm-meta span:nth-child(2){color:#caffd4;background:rgba(126,231,135,.14)}body.theme-proposal .pm-frame{background:rgba(126,231,135,.10);border-color:rgba(126,231,135,.24)}body.theme-proposal .pm-frame b,body.theme-proposal .page-preview figcaption{color:#caffd4}body.theme-proposal .page-preview figcaption{background:rgba(126,231,135,.10)}
@media(max-width:1180px){.app{grid-template-columns:1fr;grid-template-rows:auto auto auto minmax(0,1fr);height:100dvh;overflow:hidden}.header,.mode-tabs,.mobile-tabs,.side,.main,.detail,.doc-workspace{grid-column:1}.mode-tabs{grid-row:2;grid-template-columns:repeat(3,1fr)}.mobile-tabs{grid-row:3}.side,.main,.detail,.doc-workspace{grid-row:4}.doc-workspace{min-height:0;height:100%}.doc-work-control{grid-template-columns:1fr auto}.doc-page-rule{grid-column:1/-1}.page-map-layout.proposal,.page-map-layout.presentation{grid-template-columns:1fr}.page-preview{position:relative;top:0}}
@media (max-width:900px) and (orientation:portrait), (max-width:760px){.app{grid-template-rows:auto auto auto minmax(0,1fr)!important}.mode-tabs{grid-row:2;gap:6px;padding:7px;border-radius:16px}.mode-tabs button{font-size:14px;padding:11px 7px;border-radius:13px}.mobile-tabs{grid-row:3}.side,.main,.detail,.doc-workspace{grid-row:4!important}.doc-work-head{padding:12px}.doc-work-head h2{font-size:19px}.doc-work-head p{font-size:12px}.doc-work-body{padding:10px}.doc-work-control{grid-template-columns:1fr auto;gap:8px}.doc-work-control input{font-size:14px;padding:10px}.doc-page-rule{font-size:12px}.doc-page-quick button{font-size:11px;padding:7px 9px}}


/* v-swipe: Android-friendly page carousel for proposal/presentation tabs */
.doc-slide-stage{display:grid;gap:10px;border:1px solid color-mix(in srgb,var(--accent) 42%,transparent);background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.035));border-radius:22px;padding:12px;box-shadow:0 12px 28px rgba(0,0,0,.24)}
.doc-slide-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.doc-page-counter{display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:#dce8f7}.doc-page-counter b{font-size:16px;color:#fff}.doc-page-counter span{font-size:12px;border:1px solid var(--line);border-radius:999px;padding:5px 8px;background:rgba(255,255,255,.08)}
.doc-carousel{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;touch-action:pan-y;user-select:none;cursor:grab}.doc-carousel.dragging{cursor:grabbing}.doc-carousel .page-preview{position:relative;top:auto;margin:0;will-change:transform;transition:transform .16s ease, box-shadow .16s ease;border-color:color-mix(in srgb,var(--accent) 42%,var(--line));background:#101d2e}.doc-carousel.dragging .page-preview{transition:none;box-shadow:0 16px 38px rgba(0,0,0,.38),0 0 0 2px color-mix(in srgb,var(--accent) 36%,transparent)}
.doc-carousel .page-preview figcaption{display:flex;justify-content:space-between;align-items:center;gap:10px}.doc-carousel .page-preview figcaption small{font-size:12px;color:#aebed5;font-weight:800}.doc-carousel .page-preview img{pointer-events:none;-webkit-user-drag:none;max-height:calc(100dvh - 315px);object-fit:contain;background:#fff}
.doc-nav{width:48px;min-height:120px;border-radius:18px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 22%,transparent),rgba(255,255,255,.04));color:#fff;font-size:42px;font-weight:900;box-shadow:0 10px 22px rgba(0,0,0,.24);touch-action:manipulation}.doc-nav:disabled{opacity:.28;cursor:not-allowed;box-shadow:none}.doc-nav:not(:disabled):active{transform:scale(.96)}
.doc-range-wrap{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:2px 4px}.doc-range-wrap span{font-size:12px;color:#cbd8ea;font-weight:900}.doc-range-wrap input[type=range]{width:100%;accent-color:var(--accent);height:28px;touch-action:pan-y}.doc-swipe-help{text-align:center;color:#b7c8df;font-size:12px;line-height:1.4;padding-bottom:2px}
.doc-context.page-map-current{height:max-content}.doc-page-content>.page-map-layout{grid-template-columns:minmax(320px,.85fr) minmax(420px,1.15fr)}
@keyframes pageSlideNext{from{opacity:.55;transform:translateX(26px) scale(.985)}to{opacity:1;transform:translateX(0) scale(1)}}@keyframes pageSlidePrev{from{opacity:.55;transform:translateX(-26px) scale(.985)}to{opacity:1;transform:translateX(0) scale(1)}}
.doc-carousel.slide-next .page-preview{animation:pageSlideNext .18s ease-out}.doc-carousel.slide-prev .page-preview{animation:pageSlidePrev .18s ease-out}
@media(max-width:1180px){.doc-page-content>.page-map-layout{grid-template-columns:1fr}.doc-carousel .page-preview img{max-height:none}.doc-nav{width:44px;min-height:90px;font-size:34px}}
@media (max-width:900px) and (orientation:portrait), (max-width:760px){.doc-slide-stage{border-radius:16px;padding:9px;gap:8px}.doc-slide-top{gap:6px}.doc-page-counter b{font-size:14px}.doc-carousel{grid-template-columns:38px minmax(0,1fr) 38px;gap:6px}.doc-nav{width:38px;min-height:74px;border-radius:14px;font-size:30px}.doc-carousel .page-preview{border-radius:14px}.doc-carousel .page-preview figcaption{padding:8px 10px}.doc-carousel .page-preview figcaption small{display:none}.doc-range-wrap{gap:7px}.doc-swipe-help{font-size:11px}.doc-work-head p{max-width:100%}}


/* v-touch-pages: Android-friendly page navigation without numeric keypad */
.doc-work-control.no-keypad,
.doc-work-control{grid-template-columns:auto auto minmax(180px,1fr) auto auto;gap:8px;align-items:center;}
.doc-work-control input[type=number], .doc-work-control #docPageGo{display:none!important;}
.doc-page-readout{min-height:52px;border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.04));display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:8px 12px;text-align:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);}
.doc-page-readout b{font-size:18px;color:#fff;letter-spacing:-.03em}.doc-page-readout span{font-size:12px;color:#b9c9dc;font-weight:900}
.page-step{min-height:52px;min-width:74px;border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 22%,transparent),rgba(255,255,255,.05));color:#eef7ff;font-weight:1000;font-size:15px;box-shadow:0 8px 18px rgba(0,0,0,.18);touch-action:manipulation;cursor:pointer}.page-step.jump{min-width:58px;color:color-mix(in srgb,var(--accent) 70%,#fff);font-size:14px}.page-step:disabled{opacity:.33;box-shadow:none;cursor:not-allowed}.page-step:not(:disabled):active{transform:scale(.965)}
.doc-page-rule{grid-column:1/-1;padding:2px 4px;color:#c4d3e6}.doc-page-quick{overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.doc-page-quick button{white-space:nowrap;min-width:52px;text-align:center;padding:10px 12px;font-weight:900}.doc-range-wrap input[type=range]{height:44px;touch-action:pan-y}.doc-swipe-help{font-weight:800;color:#d5e3f5}.doc-carousel .page-preview img{touch-action:pan-y;}
@media(max-width:1180px){.doc-work-control{grid-template-columns:auto auto minmax(0,1fr) auto auto!important}.page-step{min-width:60px}.page-step.jump{min-width:50px}.doc-page-readout b{font-size:16px}}
@media (max-width:900px) and (orientation:portrait), (max-width:760px){.doc-work-control{position:sticky;top:0;grid-template-columns:1fr 1fr 1.4fr 1fr 1fr!important;gap:5px;padding-bottom:7px}.page-step{min-width:0;min-height:46px;border-radius:13px;font-size:13px;padding:6px 4px}.page-step.jump{font-size:12px}.doc-page-readout{min-height:46px;border-radius:14px;padding:5px 6px}.doc-page-readout b{font-size:13px}.doc-page-readout span{font-size:10px}.doc-page-rule{font-size:11px}.doc-page-quick{gap:6px}.doc-page-quick button{font-size:11px;min-width:47px;padding:8px 9px}.doc-range-wrap input[type=range]{height:42px}.doc-swipe-help{font-size:11px}}


.version-badge{
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  padding:10px 13px;border:1px solid rgba(255,255,255,.18);border-radius:999px;
  background:rgba(5,14,28,.58);color:#b9e6ff;font-size:12px;font-weight:800;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
@media(max-width:860px){.version-badge{font-size:11px;padding:8px 10px;order:20;width:100%;justify-content:center}}