/* 完整攻略分頁 — 樣式
 * 沿用 seth-session.css 的設計語彙：無圓角、深色面板、金色描邊、
 * 大字 Georgia 襯線體、字級 .55–.85rem、強調用左側 2px 色條。
 *
 * 版面刻意做成「編號清單」而不是卡片牆：
 * 使用者要的是「照做的順序」，卡片牆會讓人不知道從哪開始。
 */

.gd-wrap{max-width:760px;margin:0 auto}
.gd-h2{margin:0 0 8px;color:var(--sand);font:500 clamp(1.25rem,4.5vw,1.7rem)/1.3 Georgia,"Noto Serif TC",serif}
.gd-lead{margin:0 0 14px;color:#b9b2aa;font-size:.72rem;line-height:1.85}
.gd-lead b{color:var(--bright)}

.gd-list{counter-reset:gd;list-style:none;margin:0;padding:0}
.gd-item{counter-increment:gd;position:relative;padding:15px 0 15px 46px;
         border-top:1px solid rgba(255,255,255,.07)}
.gd-item:first-child{border-top:0;padding-top:4px}
.gd-item:before{content:counter(gd);position:absolute;left:0;top:14px;width:30px;
                color:rgba(244,207,120,.42);font:500 1.7rem/1 Georgia,serif;text-align:center}
.gd-item:first-child:before{top:3px}
.gd-item h3{margin:0 0 8px;color:var(--sand);font-size:.92rem;font-weight:900}

.gd-item .do{margin:0;padding:10px 13px;border-left:2px solid var(--cyan);
             background:rgba(67,216,211,.07);color:#c6e5e3;font-size:.74rem;line-height:1.85}
.gd-item .do b{color:var(--cyan)}
.gd-item .why{margin:9px 0 0;color:#9a938c;font-size:.66rem;line-height:1.85}
.gd-item .why b{color:#cdc6bd}
.gd-item .src{display:block;margin-top:5px;color:#6d6862;font-size:.56rem}
.gd-item .src:before{content:"實測來源："}

.gd-bonus{margin-top:16px;padding:14px;border:1px solid rgba(116,211,164,.3);
          background:rgba(116,211,164,.05)}
.gd-bonus h3{margin:0 0 7px;color:var(--green);font-size:.85rem;font-weight:900}
.gd-bonus p{margin:0;color:#c3e5d3;font-size:.7rem;line-height:1.9}
.gd-bonus b{color:var(--green)}

.gd-foot{margin-top:16px;color:var(--muted);font-size:.64rem;line-height:1.85}
.gd-foot b{color:var(--bright)}

/* 閘門：鎖住時只留標題，答案整段藏起來 */
.gd-locked .gd-item .do,
.gd-locked .gd-item .why,
.gd-locked .gd-bonus p{filter:blur(6px);pointer-events:none;user-select:none}
.gd-gate{margin:0 0 14px;padding:18px 16px;border:1px solid var(--line);
         background:linear-gradient(145deg,rgba(22,17,12,.96),rgba(7,6,10,.9));text-align:center}
.gd-gate h3{margin:0 0 8px;color:var(--bright);font-size:.95rem;font-weight:900}
.gd-gate p{max-width:34em;margin:0 auto 13px;color:#b9b2aa;font-size:.7rem;line-height:1.8}
.gd-gate .btns{display:flex;gap:7px;justify-content:center;flex-wrap:wrap}
.gd-gate a.reg{min-height:42px;display:inline-flex;align-items:center;padding:0 20px;
               border:1px solid var(--bright);background:linear-gradient(135deg,#f4cf78,#a97b2c);
               color:#15100a;font-size:.72rem;font-weight:900;text-decoration:none}
.gd-gate a.line{min-height:42px;display:inline-flex;align-items:center;padding:0 20px;
                border:1px solid rgba(116,211,164,.5);background:rgba(116,211,164,.09);
                color:var(--green);font-size:.72rem;font-weight:900;text-decoration:none}
.gd-gate .row{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.gd-gate input{min-width:170px;height:40px;padding:0 11px;border:1px solid rgba(255,255,255,.14);
               outline:none;background:#0b0910;color:#fff;font-size:.75rem}
.gd-gate input:focus{border-color:var(--gold)}
.gd-gate button{height:40px;padding:0 20px;border:1px solid var(--bright);
                background:linear-gradient(135deg,#f4cf78,#a97b2c);color:#15100a;
                font-size:.72rem;font-weight:900;cursor:pointer}
.gd-gate .note{min-height:1.2em;margin:9px 0 0;color:#ffb0bb;font-size:.64rem}

@media(max-width:640px){
  .gd-item{padding-left:36px}
  .gd-item:before{width:24px;font-size:1.35rem}
}

/* 未解鎖時的標題預覽：只有標題，沒有正文（正文根本沒下載） */
.gd-teaser h3{opacity:.55}
.gd-teaser:after{content:"解鎖後顯示";display:block;margin-top:6px;
                 color:#6d6862;font-size:.6rem;letter-spacing:.08em}