/* 지난 정답(/archive) v1 — 2026-10-28 시안. 토큰은 tokens.css(--oq-*)만 사용, 홈 v5.6 컨테이너(1176)와 같은 공통 셸을 따른다. */
.ar{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start;color:var(--oq-text);font-family:var(--oq-font)}
.ar h1,.ar h2{margin:0;padding:0;border:0}
.ar a{text-decoration:none}
.ar a:focus-visible,.ar button:focus-visible,.ar summary:focus-visible,.ar input:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}
.ar-main{display:grid;gap:14px;min-width:0}
.ar-side{display:grid;gap:14px;min-width:0}
/* hero */
.ar-hero{position:relative;display:flex;align-items:center;min-height:232px;padding:24px 28px 24px 32px;border-radius:var(--oq-r-panel);background:linear-gradient(100deg,var(--oq-primary-50) 0%,var(--oq-hero-glow) 100%);overflow:hidden}
.ar-hero-copy{position:relative;z-index:1;flex:1 1 auto;min-width:0}
.ar-eyebrow{margin:0 0 10px;font:700 14px var(--oq-font);color:var(--oq-primary-700)}
.ar-hero h1{font:800 38px/1.3 var(--oq-font);letter-spacing:-.02em;word-break:keep-all}
.ar-lede{margin:12px 0 0;font:500 15px/1.55 var(--oq-font);color:var(--oq-text-2);word-break:keep-all}
.ar-hero-art{position:relative;flex:0 0 330px;height:190px;background:url("/static/brand/archive-hero-calendar-clock.svg") center/contain no-repeat}
.ar-hero-art ul{position:absolute;inset:0;margin:0;padding:0;list-style:none}
.ar-hero-art li{position:absolute;display:flex;align-items:center;min-height:30px;padding:0 12px;border-radius:var(--oq-r-pill);background:var(--oq-surface);border:1px solid var(--oq-border);box-shadow:var(--oq-shadow);font:700 12px var(--oq-font);color:var(--oq-text);white-space:nowrap}
.ar-hero-art li:nth-child(1){top:6px;right:0}.ar-hero-art li:nth-child(2){top:46%;left:-6px}.ar-hero-art li:nth-child(3){bottom:14px;right:6px}
/* search */
.ar-search{display:flex;align-items:center;gap:10px;min-height:52px;padding:6px 6px 6px 16px;background:var(--oq-surface);border:1px solid var(--oq-border);border-radius:var(--oq-r-card);color:var(--oq-text-2)}
.ar-search input[type=search]{flex:1;min-width:0;min-height:40px;border:0;background:transparent;font:500 15px var(--oq-font);color:var(--oq-text)}
.ar-search input:focus{outline:none}.ar-search:focus-within{border-color:var(--oq-primary-600)}
.ar-btn{min-width:84px;min-height:40px;padding:0 18px;border:0;border-radius:10px;background:var(--oq-primary-700);color:var(--oq-surface);font:700 15px var(--oq-font);cursor:pointer}
.ar-hint{margin:-6px 0 0;font:500 12px var(--oq-font);color:var(--oq-text-2)}
.ar-hint a{color:var(--oq-primary-700);font-weight:700;margin-left:6px}
/* chips */
.ar-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ar-chip{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid var(--oq-border);border-radius:var(--oq-r-pill);background:var(--oq-surface);color:var(--oq-text);font:600 14px var(--oq-font);cursor:pointer;list-style:none}
.ar-chip .n{padding:1px 8px;border-radius:var(--oq-r-pill);background:var(--oq-surface-subtle);color:var(--oq-text-2);font-size:12px}
.ar-chip[aria-current=true]{background:var(--oq-primary-700);border-color:var(--oq-primary-700);color:var(--oq-surface)}
.ar-chip[aria-current=true] .n{background:rgba(255,255,255,.22);color:var(--oq-surface)}
.ar-more{position:relative}.ar-more summary::-webkit-details-marker{display:none}
.ar-more-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.ar-more[open]{flex-basis:100%}.ar-more[open] summary svg{transform:rotate(180deg)}
/* list card */
.ar-list-card{background:var(--oq-surface);border:1px solid var(--oq-border);border-radius:var(--oq-r-card);padding:16px 18px 6px}
.ar-datebar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ar-date-title{display:flex;align-items:baseline;gap:10px;min-width:0;flex-wrap:wrap}
.ar-date-title h2{font:800 20px/1.3 var(--oq-font)}
.ar-total{font:600 14px var(--oq-font);color:var(--oq-text-2)}
.ar-datepick{display:flex;align-items:center;gap:6px}
.ar-step{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--oq-border);border-radius:var(--oq-r-sm);background:var(--oq-surface);color:var(--oq-text)}
.ar-step.is-off{color:var(--color-icon-muted);background:var(--oq-surface-subtle)}
.ar-date{min-height:40px;padding:0 10px;border:1px solid var(--oq-border);border-radius:var(--oq-r-sm);background:var(--oq-surface);font:500 14px var(--oq-font);color:var(--oq-text)}
.ar-go{min-height:40px;padding:0 12px;border:1px solid var(--oq-border);border-radius:var(--oq-r-sm);background:var(--oq-surface);color:var(--oq-text);font:600 13px var(--oq-font);cursor:pointer}
.ar-scope{margin:8px 0 0;font:500 13px var(--oq-font);color:var(--oq-text-2)}
.ar-scope a{color:var(--oq-primary-700);font-weight:700}
.ar-list{list-style:none;margin:8px 0 0;padding:0}
.ar-list li+li{border-top:1px solid var(--oq-border)}
.ar-row{display:grid;grid-template-columns:44px 124px minmax(0,1fr) minmax(150px,230px) 20px;align-items:center;gap:14px;padding:14px 4px;color:inherit}
.ar-row:hover{background:var(--oq-surface-subtle)}
.ar-icon{width:44px;height:44px;border-radius:12px;object-fit:contain;display:grid;place-items:center;font:800 18px var(--oq-font);background:var(--oq-surface-subtle)}
.ar-app{display:grid;gap:2px;min-width:0}.ar-app b{font:700 15px/1.3 var(--oq-font);word-break:keep-all}.ar-app small{font:500 12px var(--oq-font);color:var(--oq-text-2)}
.ar-q{display:grid;gap:6px;min-width:0}
.ar-qt{font:500 15px/1.5 var(--oq-font);word-break:keep-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ar-when{font:500 12px var(--oq-font);color:var(--oq-text-2)}
.ar-tags{display:flex;flex-wrap:wrap;gap:6px}
.ar-tag{padding:2px 8px;border-radius:var(--oq-r-pill);background:var(--oq-surface-subtle);color:var(--oq-text-2);font:600 12px var(--oq-font)}
.ar-ans{display:grid;gap:2px;padding:9px 14px;border-radius:var(--oq-r-sm);background:var(--oq-primary-50);min-width:0}
.ar-ans small{font:700 12px var(--oq-font);color:var(--oq-primary-700)}
.ar-ans b{font:800 16px/1.35 var(--oq-font);color:var(--oq-text);overflow-wrap:anywhere;word-break:keep-all}
.ar-ans.is-cand{background:var(--oq-warning-50)}.ar-ans.is-cand small{color:var(--oq-warning-ink)}
.ar-chev{color:var(--color-icon-muted)}
.ar-note{margin:0;padding:10px 4px 12px;border-top:1px solid var(--oq-border);font:500 12px var(--oq-font);color:var(--oq-text-2)}
.ar-empty{padding:36px 8px 40px;text-align:center;color:var(--oq-text-2);font:500 14px var(--oq-font)}.ar-empty p{margin:4px 0}.ar-empty b{color:var(--oq-text);font-size:16px}.ar-empty a{color:var(--oq-primary-700);font-weight:700}
/* pager */
.ar-pager{display:flex;justify-content:center;align-items:center;gap:6px;flex-wrap:wrap}
.ar-pg{display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 6px;border:1px solid var(--oq-border);border-radius:10px;background:var(--oq-surface);color:var(--oq-text);font:600 14px var(--oq-font)}
.ar-pg.is-cur{background:var(--oq-primary-700);border-color:var(--oq-primary-700);color:var(--oq-surface)}.ar-pg.is-off{color:var(--color-icon-muted);background:var(--oq-surface-subtle)}
.ar-gap{color:var(--oq-text-2)}
/* sidebar */
.ar-box{background:var(--oq-surface);border:1px solid var(--oq-border);border-radius:var(--oq-r-card);padding:14px 16px}
.ar-box-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:10px}
.ar-box h2{font:800 16px var(--oq-font)}
.ar-box-head a{font:600 13px var(--oq-font);color:var(--oq-text-2)}
.ar-apps{list-style:none;margin:0;padding:0}.ar-apps li+li{border-top:1px solid var(--oq-border)}
.ar-apps a{display:flex;align-items:center;gap:8px;min-height:44px;color:var(--oq-text)}
.ar-app-name{flex:1;font:600 14px var(--oq-font)}.ar-app-n{font:600 13px var(--oq-font);color:var(--oq-text-2)}.ar-apps svg{color:var(--color-icon-muted)}
.ar-cal summary{list-style:none;cursor:default}.ar-cal summary::-webkit-details-marker{display:none}
.ar-cal-nav{display:flex;align-items:center;justify-content:space-between;margin:10px 0 6px}
.ar-cal-nav b{font:800 15px var(--oq-font)}
.ar-cal-nav a,.ar-cal-nav span{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:var(--oq-r-sm);font-size:20px;color:var(--oq-text)}
.ar-cal-nav .is-off{color:var(--color-icon-muted)}
.ar-grid{width:100%;border-collapse:collapse;table-layout:fixed;text-align:center}
.ar-grid th{padding:4px 0;font:600 12px var(--oq-font);color:var(--oq-text)}.ar-grid abbr{text-decoration:none}
.ar-grid .wd0,.ar-grid th.wd0{color:var(--oq-danger)}.ar-grid .wd6,.ar-grid th.wd6{color:var(--oq-blue-ink)}
.ar-grid td{padding:1px 0;font:600 13px var(--oq-font)}
.ar-grid td a,.ar-grid td span{position:relative;display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;color:inherit}
.ar-grid td a:hover{background:var(--oq-surface-subtle)}
.ar-grid td.out{color:var(--color-icon-muted)}
.ar-grid td span.off{opacity:.4}
.ar-grid td a.has::after{content:"";position:absolute;bottom:3px;width:4px;height:4px;border-radius:50%;background:var(--oq-primary-500)}
.ar-grid td a.is-sel{background:var(--oq-primary-700);color:var(--oq-surface)}.ar-grid td a.is-sel::after{background:var(--oq-surface)}
.ar-legend{margin:8px 0 0;font:500 12px var(--oq-font);color:var(--oq-text-2);display:flex;align-items:center;gap:6px}.ar-legend i{width:6px;height:6px;border-radius:50%;background:var(--oq-primary-500)}
.ar-months{display:flex;flex-wrap:wrap;gap:6px 12px;margin:10px 0 0;padding-top:10px;border-top:1px solid var(--oq-border);font:500 12px var(--oq-font)}
.ar-months span{color:var(--oq-text-2)}.ar-months a{color:var(--oq-primary-700);font-weight:600;min-height:24px}
.ar-tip{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--oq-r-card);background:var(--oq-info-50);color:var(--oq-text)}
.ar-tip-ico{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px;background:var(--oq-surface);color:var(--oq-primary-700)}
.ar-tip-text{display:grid;gap:2px;flex:1;min-width:0}.ar-tip-text b{font:800 14px var(--oq-font)}.ar-tip-text small{font:500 12px/1.5 var(--oq-font);color:var(--oq-text-2)}
.ar-tip>svg{color:var(--color-icon-muted);flex:none}
@media(min-width:901px){.ar{grid-template-columns:minmax(0,1fr) minmax(286px,26%);gap:16px}.ar-cal summary{pointer-events:none}}
@media(min-width:1200px){
  body.redesign main.shell:has(.ar){max-width:1176px;padding:18px 16px 40px}
  body.redesign:has(.ar) .site-footer .shell{max-width:1176px;padding-left:16px;padding-right:16px}
}
@media(min-width:801px) and (max-width:1199px){body.redesign main.shell:has(.ar){padding:18px 24px 40px}}
@media(max-width:1000px) and (min-width:901px){.ar-hero-art{flex-basis:260px}.ar-hero h1{font-size:32px}.ar-row{grid-template-columns:44px 100px minmax(0,1fr) minmax(130px,190px) 20px}}
@media(max-width:900px){.ar-hero h1{font-size:34px}}
@media(max-width:767px){
  body.redesign main.shell:has(.ar){padding:14px 16px 24px}
  .ar-hero{min-height:180px;padding:20px 18px}.ar-hero h1{font-size:26px}.ar-lede{font-size:14px}.ar-hero-art{display:none}
  .ar-search{min-height:48px}.ar-btn{min-width:68px}
  .ar-chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.ar-chip{flex:none}
  .ar-chips:has(.ar-more[open]){flex-wrap:wrap;overflow-x:visible}.ar-more[open]{flex-basis:100%;min-width:0}.ar-more-list{flex-wrap:wrap;max-width:100%}.ar-more-list .ar-chip{max-width:100%}
  .ar-list-card{padding:14px 14px 4px}
  .ar-datepick{width:100%}.ar-datepick .ar-date{flex:1;min-width:0}
  .ar-row{grid-template-columns:44px minmax(0,1fr) 20px;grid-template-areas:"icon app chev" "q q q" "ans ans ans";gap:10px 12px;padding:14px 0}
  .ar-icon{grid-area:icon}.ar-app{grid-area:app}.ar-q{grid-area:q}.ar-ans{grid-area:ans}.ar-chev{grid-area:chev}
  .ar-ans{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.ar-ans b{flex:1 1 auto;min-width:0}
  .ar-cal-nav a,.ar-cal-nav span{width:44px;height:44px}
  .ar-grid td a,.ar-grid td span{width:40px;height:40px}
  .ar-cal summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;min-height:44px}
  .ar-cal summary::after{content:"";width:10px;height:10px;border:solid var(--oq-text-2);border-width:0 2px 2px 0;transform:rotate(45deg);margin-right:4px}
  .ar-cal[open] summary::after{transform:rotate(-135deg)}
  .ar-side{padding-bottom:calc(8px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:no-preference){.ar-row,.ar-chip,.ar-pg{transition:background-color .15s,border-color .15s}}