/* ============================================
   PRACTICE TEST 1 — WRITING TASK 1
   ============================================ */

/* ── Page header ── */
.pt1w1-inst-header { background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);border-radius:10px;padding:14px 20px;margin-bottom:20px; }
.pt1w1-inst-label  { font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--gold);margin-bottom:4px; }
.pt1w1-inst-text   { font-size:1rem;color:rgba(255,255,255,0.85);line-height:1.5; }

/* ── Two-column layout ── */
.pt1w1-layout { display:flex; gap:24px; margin-top:20px; align-items:flex-start; }
@media(max-width:900px){ .pt1w1-layout { display:flex; gap:24px; margin-top:20px; align-items:flex-start; } }

/* ── Left: prompt + image ── */
.pt1w1-prompt-box { background:rgba(255,255,255,0.04); border:1px solid var(--border); border-radius:12px; padding:20px 24px; margin-bottom:4px; }
.pt1w1-prompt-text { font-size:1rem;color:rgba(255,255,255,0.9);line-height:1.65;margin:0 0 10px; }
.pt1w1-prompt-dir  { font-size:.92rem;color:rgba(255,255,255,0.65);font-style:italic;line-height:1.55;margin:0 0 8px; }
.pt1w1-prompt-min  { font-size:.9rem;color:rgba(255,255,255,0.55);margin:0; }
.pt1w1-prompt-min strong { color:var(--gold); }

.pt1w1-img-wrap { border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,0.12);background:rgba(0,0,0,0.3);text-align:center;min-width:520px; }
.pt1w1-map-img  { width:100%;height:auto;display:block; }
.pt1w1-img-fallback { display:flex;align-items:center;justify-content:center;height:180px;color:rgba(255,255,255,0.4);font-size:.9rem;gap:8px; }

/* ── Right: writing area ── */
.pt1w1-right { flex:1; min-width:0; display:flex; flex-direction:column; gap:10px; }
.pt1w1-write-head { display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px; }
.pt1w1-write-label { font-size:.9rem;font-weight:700;color:rgba(255,255,255,0.75);text-transform:uppercase;letter-spacing:.5px; }
.pt1w1-wc { font-size:.88rem;font-weight:700;padding:3px 10px;border-radius:20px;transition:background .25s,color .25s; }
.pt1w1-wc-low  { background:rgba(248,113,113,.15);color:#f87171;border:1px solid rgba(248,113,113,.3); }
.pt1w1-wc-warn { background:rgba(251,191,36,.12);color:var(--gold);border:1px solid rgba(251,191,36,.3); }
.pt1w1-wc-ok   { background:rgba(74,222,128,.12);color:#4ade80;border:1px solid rgba(74,222,128,.3); }

.pt1w1-textarea { width:100%;min-height:360px;background:rgba(255,255,255,0.04);border:1.5px solid rgba(255,255,255,0.15);border-radius:10px;padding:16px;color:rgba(255,255,255,0.9);font-size:.97rem;line-height:1.75;font-family:'Georgia',serif;resize:vertical;outline:none;transition:border-color .2s;box-sizing:border-box; }
.pt1w1-textarea:focus { border-color:rgba(251,191,36,0.5); }
.pt1w1-textarea::placeholder { color:rgba(255,255,255,0.2); }
.pt1w1-textarea-hint { font-size:.82rem;color:rgba(255,255,255,0.35);font-style:italic; }

/* ── Disclaimer ── */
.pt1w1-disclaimer { background:rgba(96,165,250,0.08);border:1.5px solid rgba(96,165,250,0.3);border-radius:10px;padding:12px 18px;margin-bottom:14px;font-size:.92rem;color:rgba(255,255,255,0.8);line-height:1.6; }
.pt1w1-disclaimer strong { color:#60a5fa; }

/* ── Sample toggle button ── */
.pt1w1-sample-toggle-row { text-align:center;margin:6px 0 20px; }
.pt1w1-sample-btn { background:rgba(251,191,36,0.1);border:1.5px solid rgba(251,191,36,0.4);color:var(--gold);border-radius:8px;padding:10px 24px;font-size:.95rem;font-weight:700;cursor:pointer;transition:background .15s; }
.pt1w1-sample-btn:hover { background:rgba(251,191,36,0.22); }

/* ── Sample answer section ── */
.pt1w1-sample-wrap { background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.1);border-radius:14px;padding:22px 26px;margin-bottom:24px; }
.pt1w1-sample-header { display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:8px; }
.pt1w1-band-badge { background:var(--gold);color:#111;font-weight:900;font-size:.85rem;padding:3px 12px;border-radius:20px;white-space:nowrap; }
.pt1w1-sample-title { font-size:1rem;font-weight:700;color:rgba(255,255,255,0.9); }

.pt1w1-ann-legend { display:flex;gap:10px;flex-wrap:wrap;margin-left:auto; }
.pt1w1-ann-legend .pt1w1-ann { font-size:.78rem;padding:2px 8px;border-radius:4px;cursor:default; }

.pt1w1-ann-hint { font-size:.82rem;color:rgba(255,255,255,0.4);font-style:italic;margin-bottom:14px; }

/* ── Sample text ── */
.pt1w1-sample-text { font-size:1.05rem;line-height:2.1;color:rgba(255,255,255,0.88);font-family:'Georgia',serif;position:relative; }
.pt1w1-sample-text p { margin:0 0 14px; }

/* ── Annotation spans ── */
.pt1w1-ann { border-radius:3px;padding:1px 4px;cursor:pointer;transition:opacity .15s;position:relative; }
.pt1w1-ann:hover { opacity:.82; }
.pt1w1-ann-good { background:rgba(74,222,128,0.18);border-bottom:2px solid #4ade80;color:rgba(255,255,255,0.95); }
.pt1w1-ann-err  { background:rgba(248,113,113,0.18);border-bottom:2px solid #f87171;color:rgba(255,255,255,0.95); }
.pt1w1-ann-note { background:rgba(96,165,250,0.18);border-bottom:2px solid #60a5fa;color:rgba(255,255,255,0.95);font-style:italic;font-size:.88em; }

/* ── Annotation popup ── */
.pt1w1-ann-popup { position:fixed;background:#1e1e38;border:1.5px solid rgba(255,255,255,0.22);border-radius:10px;padding:12px 16px;font-size:.88rem;color:rgba(255,255,255,0.92);line-height:1.65;width:300px;z-index:9999;box-shadow:0 8px 32px rgba(0,0,0,0.6);font-family:'Inter',sans-serif;pointer-events:none; }

/* ── Examiner comment cards ── */
.pt1w1-comments-grid { display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:24px; }
@media(max-width:700px){ .pt1w1-comments-grid { grid-template-columns:1fr; } }
.pt1w1-comment-card { background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);border-radius:10px;padding:14px 16px; }
.pt1w1-comment-head { font-size:.88rem;font-weight:700;color:var(--gold);margin-bottom:8px;display:flex;align-items:center;gap:6px; }
.pt1w1-comment-body { font-size:.9rem;color:rgba(255,255,255,0.78);line-height:1.65; }
.pt1w1-comment-body em { color:rgba(255,255,255,0.55); }


/* ?? Annotation emoji indicators ?? */
.pt1w1-ann-good::before { content: '?? '; font-style: normal; }
.pt1w1-ann-err::before  { content: '?? '; font-style: normal; }

/* ── Annotation emoji indicators ── */
.pt1w1-ann[data-icon]::before { content: attr(data-icon) ' '; font-style: normal; font-family: 'Segoe UI Emoji', 'Apple Color Emoji', sans-serif; }