#view-gsat-past { min-height: 100vh; color: var(--text-main); }
.pe-hub-card { display:flex; width:100%; align-items:center; gap:16px; text-align:left; margin:0 0 14px; padding:17px 16px; color:var(--text-main); border:1px solid rgba(239,191,111,.42); border-radius:14px; background:linear-gradient(110deg,rgba(167,112,44,.17),rgba(243,190,96,.05)); cursor:pointer; font:inherit; transition:transform .22s,border-color .22s,background .22s; }
.pe-hub-card:hover { transform:translateY(-2px); border-color:#f2c784; background:linear-gradient(110deg,rgba(167,112,44,.25),rgba(243,190,96,.08)); }
.pe-hub-icon { display:grid; place-items:center; flex:none; width:46px; height:46px; border-radius:13px; color:#ffdfaa; font-family:Georgia,serif; font-weight:700; font-size:1.07rem; background:linear-gradient(145deg,#5b391e,#241b17); box-shadow:inset 0 1px 0 rgba(255,224,176,.35),0 5px 20px rgba(0,0,0,.2); }
.pe-hub-copy { display:grid; gap:4px; min-width:0; flex:1; }
.pe-hub-copy strong { font-size:1.03rem; letter-spacing:.02em; }
.pe-hub-copy small { font-size:.8rem; line-height:1.45; color:var(--text-sub); }
.pe-hub-arrow { color:#edc88c; font-size:1.5rem; }
.pe-nav { position:sticky; top:0; z-index:20; min-height:58px; padding:8px 16px; display:flex; align-items:center; gap:12px; background:rgba(23,18,15,.93); border-bottom:1px solid rgba(240,195,131,.16); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.pe-nav .btn-icon { flex:none; }
#pe-nav-title { font-size:.95rem; font-weight:700; letter-spacing:.04em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
.pe-word-count { white-space:nowrap; border:1px solid rgba(120,212,208,.42); border-radius:100px; padding:4px 10px; font-size:.74rem; color:#9ae2da; }
.pe-content { width:min(100%,840px); padding:20px 16px 88px; margin:0 auto; box-sizing:border-box; }
.pe-rise { animation:pe-rise .42s both; }
@keyframes pe-rise { from {opacity:0;transform:translateY(12px)} to {opacity:1;transform:translateY(0)} }
.pe-eyebrow { color:#eac78b; text-transform:uppercase; font-size:.73rem; font-weight:800; letter-spacing:.18em; }
.pe-title { margin:8px 0 9px; font-size:clamp(1.55rem,5vw,2.15rem); line-height:1.25; letter-spacing:.02em; }
.pe-muted { color:var(--text-sub); line-height:1.65; font-size:.87rem; }
.pe-hero { position:relative; overflow:hidden; margin-bottom:22px; padding:27px 22px 24px; border:1px solid rgba(247,206,147,.3); border-radius:22px; background:radial-gradient(circle at 87% 18%,rgba(235,172,84,.27),transparent 33%),radial-gradient(circle at 5% 115%,rgba(109,74,137,.25),transparent 55%),linear-gradient(140deg,rgba(57,38,27,.95),rgba(25,21,23,.98)); box-shadow:0 20px 44px rgba(0,0,0,.13),inset 0 1px rgba(255,243,216,.1); }
.pe-hero::after { content:""; pointer-events:none; position:absolute; inset:-120% -50%; width:36%; background:linear-gradient(90deg,transparent,rgba(255,231,181,.09),transparent); transform:rotate(28deg); animation:pe-shine 9s linear infinite; }
@keyframes pe-shine { from {left:-70%} to {left:180%} }
.pe-hero > * { position:relative; z-index:1; }
.pe-year-row { display:flex; align-items:stretch; gap:10px; margin:12px 0; }
.pe-year { flex:1; min-width:0; text-align:left; border:1px solid rgba(255,217,161,.38); border-radius:18px; background:linear-gradient(110deg,rgba(154,103,55,.26),rgba(35,31,34,.93)); color:var(--text-main); padding:17px; cursor:pointer; font:inherit; transition:transform .2s,border-color .2s; }
.pe-year:hover,.pe-download:hover,.pe-mode:hover,.pe-section:hover { transform:translateY(-2px); border-color:#efc681; }
.pe-year strong { display:block; font:700 2.25rem/1.1 Georgia,serif; color:#ffe0ad; }
.pe-year span { display:block; color:var(--text-sub); font-size:.78rem; margin-top:5px; }
.pe-download { display:grid; align-content:center; justify-items:center; flex:none; width:100px; padding:9px; border:1px solid rgba(137,208,207,.35); border-radius:16px; background:rgba(62,113,111,.13); color:#b9e8e3; text-decoration:none; text-align:center; font-size:.78rem; font-weight:700; transition:transform .2s,border-color .2s; }
.pe-download svg { width:22px; height:22px; margin-bottom:5px; fill:none; stroke:currentColor; stroke-width:2; }
.pe-mode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0; }
.pe-mode { min-height:135px; text-align:left; padding:18px; border:1px solid rgba(246,204,144,.27); border-radius:18px; background:linear-gradient(150deg,rgba(124,91,56,.2),rgba(26,24,25,.8)); color:var(--text-main); cursor:pointer; font:inherit; transition:transform .2s,border-color .2s,box-shadow .2s; }
.pe-mode:hover { box-shadow:0 10px 28px rgba(0,0,0,.25); }
.pe-mode-icon { display:block; font-size:1.6rem; color:#eac78b; margin-bottom:12px; }
.pe-mode strong { display:block; font-size:1.05rem; }
.pe-mode small { display:block; color:var(--text-sub); margin-top:5px; line-height:1.5; }
.pe-source-links { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.pe-source-links a { color:#aee2e0; font-size:.78rem; text-decoration:none; border-bottom:1px solid rgba(174,226,224,.4); }
.pe-section-list { display:grid; gap:10px; margin:16px 0; }
.pe-section { display:flex; width:100%; align-items:center; gap:12px; text-align:left; padding:15px; border:1px solid rgba(227,196,152,.23); border-radius:15px; background:rgba(255,241,218,.045); color:var(--text-main); cursor:pointer; font:inherit; transition:transform .2s,border-color .2s; }
.pe-section-index { display:grid; place-items:center; flex:none; width:35px; height:35px; border-radius:11px; color:#efd39f; background:rgba(221,176,101,.11); font-family:Georgia,serif; }
.pe-section-name { flex:1; min-width:0; font-size:.94rem; font-weight:700; }
.pe-section-name small { display:block; margin-top:3px; color:var(--text-sub); font-weight:400; font-size:.76rem; }
.pe-section-points { font-size:.78rem; color:#efd39f; }
.pe-progress { height:5px; margin:14px 0 18px; border-radius:100px; background:rgba(255,255,255,.12); overflow:hidden; }
.pe-progress > span { display:block; height:100%; border-radius:100px; background:linear-gradient(90deg,#cc9c57,#ffe3a6); transition:width .3s; }
.pe-crumb { color:#e5c28a; font-size:.78rem; font-weight:700; letter-spacing:.05em; }
.pe-group-title { margin:4px 0 15px; color:var(--text-sub); font-size:.83rem; }
.pe-tabs { display:flex; gap:7px; overflow-x:auto; scrollbar-width:none; margin:0 -16px 16px; padding:0 16px 4px; }
.pe-tabs::-webkit-scrollbar { display:none; }
.pe-tab { flex:none; padding:8px 11px; border:1px solid rgba(237,198,145,.23); border-radius:100px; background:rgba(255,255,255,.035); color:var(--text-sub); cursor:pointer; font-family:inherit; font-size:.73rem; font-weight:600; line-height:1.2; white-space:nowrap; }
.pe-tab.active { background:rgba(230,184,112,.18); border-color:rgba(244,199,133,.78); color:#f4d29e; }
.pe-passage { padding:20px; margin:15px 0 18px; border:1px solid rgba(186,149,105,.24); border-left:3px solid rgba(236,189,124,.75); border-radius:14px; background:rgba(0,0,0,.16); color:var(--text-main); font-size:.96rem; line-height:1.9; white-space:pre-line; overflow-wrap:anywhere; }
.pe-blank { display:inline-grid; place-items:center; min-width:31px; line-height:1.25; padding:3px 7px; margin:0 3px; color:#241810; background:#f1c98d; border-radius:6px; font-size:.74rem; font-weight:800; }
.pe-figure { display:block; width:100%; height:auto; margin:16px 0; border-radius:12px; border:1px solid rgba(255,255,255,.15); }
.pe-qcard { padding:22px 19px; border:1px solid rgba(244,207,150,.33); border-radius:19px; background:linear-gradient(145deg,rgba(66,47,34,.88),rgba(26,24,25,.94)); box-shadow:0 13px 28px rgba(0,0,0,.14); }
.pe-qtop { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:15px; color:#f4d29e; font-size:.76rem; font-weight:800; letter-spacing:.08em; }
.pe-qtext { margin:0 0 17px; font-size:1.07rem; line-height:1.7; white-space:pre-line; overflow-wrap:anywhere; }
.pe-choices { display:grid; gap:9px; }
.pe-choice { display:flex; align-items:flex-start; width:100%; gap:11px; padding:12px 13px; border:1px solid rgba(236,215,188,.21); border-radius:12px; background:rgba(255,255,255,.04); color:var(--text-main); cursor:pointer; text-align:left; font:inherit; line-height:1.55; transition:border-color .16s,background .16s,transform .16s; }
.pe-choice:hover { border-color:rgba(250,205,137,.65); background:rgba(229,182,106,.08); }
.pe-choice.is-picked { border-color:#e8bc78; background:rgba(231,185,107,.17); }
.pe-choice.is-correct { border-color:#75cfaf; background:rgba(74,178,136,.15); }
.pe-choice.is-wrong { border-color:#e68679; background:rgba(192,78,66,.13); }
.pe-choice-letter { flex:none; display:grid; place-items:center; width:26px; height:26px; border:1px solid currentColor; border-radius:8px; color:#e7c58b; font-size:.78rem; font-weight:800; }
.pe-choice-body { flex:1; min-width:0; overflow-wrap:anywhere; }
.pe-choice-body img { display:block; max-width:100%; max-height:280px; margin:7px 0; border-radius:8px; background:#fff; }
.pe-answer { margin-top:17px; padding:15px; border:1px solid rgba(119,204,171,.37); border-radius:12px; background:rgba(72,154,125,.09); line-height:1.65; font-size:.87rem; }
.pe-answer strong { color:#99e2c1; }
.pe-answer p { margin:8px 0 0; color:var(--text-sub); }
.pe-answer .pe-suggested { color:var(--text-main); white-space:pre-line; line-height:1.8; }
.pe-written { margin-top:12px; padding:12px; border:1px dashed rgba(242,200,139,.37); border-radius:10px; color:#efd5ac; font-size:.83rem; }
.pe-controls { position:sticky; bottom:max(12px,env(safe-area-inset-bottom)); z-index:10; display:flex; gap:9px; margin:17px 0; padding:7px; border:1px solid rgba(248,206,144,.28); border-radius:15px; background:rgba(31,25,23,.94); box-shadow:0 10px 30px rgba(0,0,0,.32); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.pe-controls button { flex:1; min-height:46px; margin:0; }
.pe-note { padding:13px 14px; border-radius:12px; color:var(--text-sub); background:rgba(255,255,255,.04); font-size:.77rem; line-height:1.6; }
.pe-result { text-align:center; padding:30px 20px; border-radius:22px; border:1px solid rgba(236,194,129,.35); background:radial-gradient(circle at 50% 0,rgba(219,162,76,.19),transparent 60%),rgba(33,27,25,.88); }
.pe-result-score { font:700 clamp(3rem,12vw,5rem)/1 Georgia,serif; color:#ffe0a6; margin:22px 0 4px; }
.pe-result small { color:var(--text-sub); }
.pe-word-help { margin:12px 0; color:#a9dcd4; font-size:.78rem; }
.pe-qcard .wp-word,.pe-passage .wp-word { border-radius:3px; cursor:pointer; }
.pe-qcard .wp-word:hover,.pe-passage .wp-word:hover { background:rgba(123,222,211,.2); }
@media (max-width:600px) { .pe-content { padding:17px 13px 80px; } .pe-tabs { margin-left:-13px; margin-right:-13px; padding-left:13px; padding-right:13px; } .pe-mode { min-height:140px; padding:15px; } .pe-passage { padding:16px 14px; font-size:.91rem; } .pe-qcard { padding:18px 15px; } .pe-download { width:85px; } }
@media (prefers-reduced-motion:reduce) { .pe-rise,.pe-hero::after { animation:none!important; } .pe-hub-card,.pe-year,.pe-download,.pe-mode,.pe-section,.pe-choice,.pe-progress>span { transition:none!important; } }
