/* G.Y.O 테크 글래스 기준 (2026-10-17). 기준 문서: brand/guide.html, docs/ui-consistency.md.
   html[data-skin="tech"]일 때만 적용한다. 적용 화면은 login.js의 TECH_SKIN_ROUTES에서 정한다.
   site-ui.css 뒤에 불러온다. 색상표·대비 계산이 읽는 색은 불투명 hex로 둔다. */
:root[data-skin="tech"]{
  --bg:#04060a; --bg-elev:#0b0f16; --bg-soft:rgba(255,255,255,.035);
  --border:#1d222b; --border-strong:#333740;
  --text:#eaf0f8; --text-soft:#a9b4c6; --text-mute:#7f8a9e;
  --accent:#5b8cff; --accent-strong:#3563d9; --accent-2:#38d6ff; --accent-3:#8b6bff;
  --accent-soft:#151f34; --accent-ink:#a3c0ff;
  --ok:#2ee6a6; --ok-soft:#102d2a; --warn:#ffc35a; --warn-soft:#2d2820; --danger:#ff5d73; --danger-soft:#2d1a23;
  --rise:#ff5470; --fall:#3d9bff;
  --glass-surface:rgba(12,16,24,.52); --glass-strong:rgba(10,14,21,.72); --glass-nav:rgba(6,9,14,.62); --glass-pop:rgba(10,14,21,.86);
  --glass-line:rgba(255,255,255,.08); --glass-line-strong:rgba(255,255,255,.16);
  --edge:linear-gradient(140deg,rgba(255,255,255,.13),rgba(255,255,255,.05) 40%,rgba(255,255,255,.04) 65%,rgba(91,140,255,.16));
  --glass-hi:rgba(255,255,255,.07);
  --blob-a:rgba(56,214,255,.12); --blob-b:rgba(139,107,255,.10); --blob-c:rgba(91,140,255,.06);
  --shadow:0 1px 0 var(--glass-hi) inset,0 10px 40px rgba(0,0,0,.42);
  --shadow-lg:0 1px 0 var(--glass-hi) inset,0 24px 64px rgba(0,0,0,.6);
  --glow-line:var(--glass-line); --surface-highlight:transparent; --ambient-cyan:transparent; --ambient-blue:transparent;
  --radius:12px; --radius-sm:8px; --radius-xs:4px; --radius-lg:14px;
  --dur-fast:140ms; --dur-base:220ms; --dur-slow:640ms; --dur-exit:150ms; --dur-enter:320ms;
  --ease:cubic-bezier(.16,1,.3,1); --ease-in-out:cubic-bezier(.65,0,.35,1); --ease-exit:cubic-bezier(.4,0,1,1);
  --fs-xl:34px; --fs-display:44px;
  --ui-page-top:40px; --ui-header-gap:28px; --ui-section-gap:18px;
  --button-ink:#fff;
  --font-tech:"Cascadia Mono",Consolas,"Malgun Gothic","Apple SD Gothic Neo",sans-serif;
}
:root[data-skin="tech"][data-theme="light"]{
  --bg:#eef1f7; --bg-elev:#ffffff; --bg-soft:rgba(15,23,42,.035);
  --border:#e3e6eb; --border-strong:#d0d4db;
  --text:#0a1222; --text-soft:#3c485c; --text-mute:#5b687c;
  --accent:#2357e6; --accent-strong:#2357e6; --accent-2:#0a8fbf; --accent-3:#6a48e8;
  --accent-soft:#ebf0fd; --accent-ink:#1c4ac2;
  --ok:#0b7a55; --ok-soft:#e3f6ee; --warn:#8a5a00; --warn-soft:#fff4dc; --danger:#c8253b; --danger-soft:#ffebee;
  --rise:#d91f3a; --fall:#1d5fd6;
  --glass-surface:rgba(255,255,255,.58); --glass-strong:rgba(255,255,255,.78); --glass-nav:rgba(255,255,255,.66); --glass-pop:rgba(255,255,255,.92);
  --glass-line:rgba(15,23,42,.09); --glass-line-strong:rgba(15,23,42,.18);
  --edge:linear-gradient(140deg,rgba(255,255,255,.95),rgba(15,23,42,.07) 45%,rgba(15,23,42,.08) 70%,rgba(35,87,230,.14));
  --glass-hi:rgba(255,255,255,.9);
  --blob-a:rgba(10,143,191,.10); --blob-b:rgba(106,72,232,.08); --blob-c:rgba(35,87,230,.05);
  --shadow:0 1px 0 var(--glass-hi) inset,0 10px 32px rgba(15,23,42,.08);
  --shadow-lg:0 1px 0 var(--glass-hi) inset,0 24px 64px rgba(15,23,42,.16);
}
@media(max-width:600px){:root[data-skin="tech"]{--ui-page-top:24px;--ui-header-gap:20px;--ui-section-gap:12px;--fs-xl:28px;--fs-display:32px}}

/* ── 배경: 천천히 흐르는 오로라(격자는 2026-10-19 사용자 지시로 없앴다) ─────────────── */
[data-skin="tech"] body{background:var(--bg)}
[data-skin="tech"] body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none}
[data-skin="tech"] body::after{inset:-20%;z-index:-2;filter:blur(20px);
  background:radial-gradient(36% 30% at 18% 8%,var(--blob-a),transparent 70%),radial-gradient(34% 32% at 86% 6%,var(--blob-b),transparent 70%),radial-gradient(40% 36% at 60% 70%,var(--blob-c),transparent 72%);
  animation:gyo-aurora 64s var(--ease-in-out) infinite alternate}
@keyframes gyo-aurora{to{transform:translate3d(-2%,2%,0) scale(1.03)}}

/* ── 유리 판: padding-box 유리 + border-box 빛 테두리 ───────────── */
[data-skin="tech"] .nav,[data-skin="tech"] .site-panel,[data-skin="tech"] .dashboard .dash-section,[data-skin="tech"] #view .shadow-embedded{
  border:1px solid transparent;
  background:linear-gradient(var(--glass-surface),var(--glass-surface)) padding-box,var(--edge) border-box;
  box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%)}
[data-skin="tech"] .nav{background:linear-gradient(var(--glass-nav),var(--glass-nav)) padding-box,var(--edge) border-box;border-radius:var(--radius-lg)}
[data-skin="tech"] .dashboard .dash-section,[data-skin="tech"] #view .shadow-embedded{border-radius:var(--radius)}
[data-skin="tech"] .nav.is-scrolled{box-shadow:var(--shadow-lg)}
[data-skin="tech"] .nav .links>a{position:relative;color:var(--text-soft);border:0;border-radius:var(--radius-sm);transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease)}
[data-skin="tech"] .nav .links>a:hover:not([aria-current="page"]){background:var(--bg-soft);color:var(--text)}
[data-skin="tech"] .nav .links>a[aria-current="page"]{background:transparent;color:var(--text)}
[data-skin="tech"] .nav .links>a[aria-current="page"]::after{content:"";position:absolute;left:12px;right:12px;bottom:2px;height:2px;border-radius:2px;background:var(--accent)}
[data-skin="tech"] .nav .nav-search{border-radius:var(--radius-sm);background:var(--bg-soft);border-color:var(--glass-line)}

/* ── 키보드 초점 ───────────────────────────────────────────────── */
[data-skin="tech"] :focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}
[data-skin="tech"][data-theme="light"] :focus-visible{outline-color:var(--accent)}

/* ── 글자 ─────────────────────────────────────────────────────── */
[data-skin="tech"] #view :is(.site-page-head,.dash-page-head) h1{font-weight:600;letter-spacing:-.04em;
  background:linear-gradient(180deg,var(--text) 35%,color-mix(in srgb,var(--text) 55%,var(--accent)));-webkit-background-clip:text;background-clip:text;color:transparent}
[data-skin="tech"] #view :is(.site-page-head,.dash-page-head) :is(.sub,.site-page-subtitle){color:var(--text-mute)}
[data-skin="tech"] .site-number,[data-skin="tech"] .num,[data-skin="tech"] #view .dash-date-line,[data-skin="tech"] #view .shadow-message-meta,[data-skin="tech"] #view .shadow-date{font-variant-numeric:tabular-nums}
[data-skin="tech"] .tech-mono,[data-skin="tech"] #view .dash-week-title,[data-skin="tech"] #view .shadow-date,[data-skin="tech"] .dashboard .dash-date-line{font-family:var(--font-tech)}
[data-skin="tech"] #view .dash-week-title{font-size:var(--fs-xs);letter-spacing:.04em;color:var(--text-mute)}
[data-skin="tech"] #view .shadow-date{letter-spacing:.06em}

/* ── 버튼 ─────────────────────────────────────────────────────── */
[data-skin="tech"] .site-button,[data-skin="tech"] #view .dash-button{border-radius:var(--radius-sm);background:var(--bg-soft);border:1px solid var(--glass-line-strong);color:var(--text);
  transition:transform var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
[data-skin="tech"] .site-button:hover:not(:disabled),[data-skin="tech"] #view .dash-button:hover:not(:disabled){filter:none;color:var(--text);border-color:color-mix(in srgb,var(--accent) 70%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
[data-skin="tech"] .site-button.primary{color:#fff;border-color:transparent;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent-strong) 88%,#fff),var(--accent-strong));
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 4px 14px color-mix(in srgb,var(--accent-strong) 24%,transparent)}
[data-skin="tech"] .site-button.primary:hover:not(:disabled){color:#fff;border-color:transparent;filter:brightness(1.08)}
[data-skin="tech"] .site-button.danger{color:var(--danger)}
[data-skin="tech"] .site-button:active:not(:disabled),[data-skin="tech"] #view .dash-button:active:not(:disabled),[data-skin="tech"] .icon-btn:active:not(:disabled){transform:scale(.97)}
[data-skin="tech"] .site-tabs>a{border-color:var(--glass-line);border-radius:var(--radius-sm)}
[data-skin="tech"] .site-tabs>a[aria-current=page]{border-color:color-mix(in srgb,var(--accent) 55%,transparent)}
[data-skin="tech"] .site-field :where(input:not([type=checkbox]):not([type=radio]),select,textarea){border-radius:var(--radius-xs);background:var(--bg-soft)}
/* 선택 목록 펼침: 반투명 배경이 흰 기본 목록으로 바뀌며 글자가 사라지지 않게 단색 배경·본문 글자색 지정 */
[data-skin="tech"] select :is(option,optgroup){background-color:var(--bg-elev);color:var(--text)}

/* ── Dashboard 이번 주 일정 ───────────────────────────────────── */
[data-skin="tech"] .dashboard .dash-day{background:var(--bg-soft);border:1px solid var(--glass-line);border-radius:var(--radius-sm);transition:border-color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease)}
[data-skin="tech"] .dashboard .dash-day:hover{border-color:var(--glass-line-strong);background:color-mix(in srgb,var(--accent) 6%,transparent)}
[data-skin="tech"] .dashboard .dash-date-line{font-size:var(--fs-xs);letter-spacing:.02em;color:var(--text-soft)}
[data-skin="tech"] .dashboard .dash-date-line.sun{color:var(--danger)}
[data-skin="tech"] .dashboard .dash-date-line.sat{color:var(--accent-ink)}
[data-skin="tech"] .dashboard .dash-day-event{background:color-mix(in srgb,var(--accent) 14%,transparent);box-shadow:none;color:var(--text)}
[data-skin="tech"] .dashboard .dash-week-panel .dash-day-event{border-left:2px solid var(--accent)}
[data-skin="tech"] .dashboard .dash-day.today{position:relative;border-color:transparent;
  background:linear-gradient(color-mix(in srgb,var(--accent) 8%,var(--bg-elev)),color-mix(in srgb,var(--accent) 3%,var(--bg-elev))) padding-box,linear-gradient(160deg,color-mix(in srgb,var(--accent-2) 70%,var(--accent)),var(--accent)) border-box;
  box-shadow:0 0 16px color-mix(in srgb,var(--accent) 14%,transparent)}
[data-skin="tech"] .dashboard .dash-today-badge{font-size:var(--fs-xs);letter-spacing:.06em;border-radius:var(--radius-xs);background:color-mix(in srgb,var(--accent-2) 18%,transparent);color:var(--accent-2)}
[data-skin="tech"][data-theme="light"] .dashboard .dash-today-badge{color:#06617f}

/* ── Shadow ───────────────────────────────────────────────────── */
[data-skin="tech"] #view .shadow-avatar{border-radius:50%;border:0;box-shadow:none}
[data-skin="tech"] #view .shadow-work-card{border:1px solid var(--glass-line);border-radius:var(--radius-sm);background:var(--bg-soft);transition:border-color var(--dur-base) var(--ease),background-color var(--dur-base) var(--ease)}
[data-skin="tech"] #view .shadow-work-card:hover{border-color:var(--glass-line-strong)}
[data-skin="tech"] #view .shadow-work-state{border-radius:var(--radius-xs);transition:background-color var(--dur-base) var(--ease),color var(--dur-base) var(--ease)}
[data-skin="tech"] #view .shadow-work-state::before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:currentColor;vertical-align:1px}
[data-skin="tech"] #view .shadow-date::before,[data-skin="tech"] #view .shadow-date::after{background:linear-gradient(90deg,transparent,var(--glass-line-strong),transparent)}
[data-skin="tech"] #view .shadow-bubble{border:1px solid transparent;border-radius:3px var(--radius-sm) var(--radius-sm);background:linear-gradient(var(--glass-strong),var(--glass-strong)) padding-box,var(--edge) border-box}
[data-skin="tech"] #view .shadow-message.is-user .shadow-bubble{background:linear-gradient(color-mix(in srgb,var(--accent) 16%,var(--glass-strong)),color-mix(in srgb,var(--accent) 16%,var(--glass-strong))) padding-box,var(--edge) border-box}
[data-skin="tech"] #view .shadow-composer{border:1px solid transparent;border-radius:var(--radius);background:linear-gradient(var(--glass-strong),var(--glass-strong)) padding-box,var(--edge) border-box;transition:box-shadow var(--dur-base) var(--ease)}
[data-skin="tech"] #view .shadow-composer:has(textarea:focus){box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
[data-skin="tech"] #view .shadow-composer .shadow-send{border-radius:var(--radius-sm)}

/* ── 팝업: 판보다 덜 비치는 유리 + 열림 모션 ───────────────────── */
[data-skin="tech"] .dash-schedule-popover,[data-skin="tech"] #view .shadow-confirmation-popup,[data-skin="tech"] .shadow-work-tooltip,[data-skin="tech"] .menu .dropdown,[data-skin="tech"] .site-dialog{
  border:1px solid transparent;border-radius:var(--radius);
  background:linear-gradient(var(--glass-pop),var(--glass-pop)) padding-box,var(--edge) border-box;box-shadow:var(--shadow-lg);
  -webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%);transform-origin:var(--pop-origin,top center)}
[data-skin="tech"] .menu .dropdown,[data-skin="tech"] #view .shadow-confirmation-popup{--pop-origin:top right}
[data-skin="tech"] #view .shadow-confirmation-popup :is(.site-panel,.ws-project-overview,.ws-confirmations,.ws-review-queue,.shadow-confirmation-content){background:transparent;border-color:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
@keyframes gyo-pop-in{from{opacity:0;transform:translateY(-6px) scale(.97);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
@keyframes gyo-pop-out{to{opacity:0;transform:translateY(-4px) scale(.98);filter:blur(2px)}}
@keyframes gyo-item-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
[data-skin="tech"] .dash-schedule-popover:not(.is-leaving),[data-skin="tech"] #view .shadow-confirmation-popup:not([hidden]):not(.is-leaving),[data-skin="tech"] .shadow-work-tooltip:not([hidden]):not(.is-leaving),[data-skin="tech"] .menu.open .dropdown:not(.is-leaving),[data-skin="tech"] .site-dialog[open]:not(.is-leaving){animation:gyo-pop-in var(--dur-base) var(--ease) both}
[data-skin="tech"] .dash-schedule-popover>:not(header){animation:gyo-item-in var(--dur-enter) var(--ease) both;animation-delay:calc(60ms + var(--n,0) * 35ms)}
[data-skin="tech"] .is-leaving{animation:gyo-pop-out var(--dur-exit) var(--ease-exit) both!important;pointer-events:none!important}
[data-skin="tech"] .is-leaving>*{animation:none!important}
/* 닫힘(2026-10-28): 상단 메뉴·알림 창·모든 창(dialog, 화면 안에 붙는 inline 판 제외)·Shadow 확인 창도 Dashboard 일정 창(is-leaving)과 같은 150ms로 살짝 위로 줄며 사라진다.
   숨김(display:none)·dialog 닫힘으로 바뀐 뒤에도 150ms 동안 allow-discrete로 보이게 두고, 그동안 gyo-pop-out을 돌린다.
   (opacity 전환은 열림 애니메이션이 끝난 값에서 시작하지 않아 바로 0이 됐다.) 처음 그릴 때는 숨김이라 닫힘 애니메이션이 돌지 않는다.
   지원하지 않는 브라우저는 예전처럼 바로 닫힌다. */
@keyframes gyo-fade-out{to{opacity:0}}
[data-skin="tech"] :is(.menu .dropdown,.shell-notification-panel,#view .shadow-confirmation-popup,dialog:not(.site-inline-panel)){transition:display 150ms allow-discrete,overlay 150ms allow-discrete}
[data-skin="tech"] :is(.menu:not(.open) .dropdown,.shell-notification-panel[hidden],#view .shadow-confirmation-popup[hidden],dialog:not([open]):not(.site-inline-panel)){animation:gyo-pop-out 150ms var(--ease-exit) both;pointer-events:none}
[data-skin="tech"] dialog:not(.site-inline-panel)::backdrop{transition:display 150ms allow-discrete,overlay 150ms allow-discrete}
[data-skin="tech"] .site-dialog[open]::backdrop{animation:gyo-fade 220ms var(--ease) both}
[data-skin="tech"] dialog:not([open]):not(.site-inline-panel)::backdrop{animation:gyo-fade-out 150ms var(--ease-exit) both}

/* ── 화면 전환(View Transitions)과 등장 ───────────────────────── */
[data-skin="tech"] .nav{view-transition-name:gyo-nav}
[data-skin="tech"]::view-transition-old(root){animation:gyo-vt-out var(--dur-exit) var(--ease-exit) both}
[data-skin="tech"]::view-transition-new(root){animation:gyo-vt-in var(--dur-base) var(--ease) 80ms both}
[data-skin="tech"]::view-transition-group(gyo-nav),[data-skin="tech"]::view-transition-new(gyo-nav){animation:none}
[data-skin="tech"]::view-transition-old(gyo-nav){display:none}
@keyframes gyo-vt-out{to{opacity:0;transform:scale(.992);filter:blur(4px)}}
@keyframes gyo-vt-in{from{opacity:0}}
@keyframes gyo-rise{from{opacity:0;transform:translateY(12px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
[data-skin="tech"] .rise{animation:gyo-rise var(--dur-slow) var(--ease) both;animation-delay:calc(var(--i,0) * 50ms)}

/* ── 상태 변화 ─────────────────────────────────────────────────── */
@keyframes gyo-week-next{from{opacity:0;transform:translateX(18px)}}
@keyframes gyo-week-prev{from{opacity:0;transform:translateX(-18px)}}
[data-skin="tech"] .dash-calendar.week-slide.from-next .dash-day{animation:gyo-week-next var(--dur-enter) var(--ease) both;animation-delay:calc(var(--d,0) * 22ms)}
[data-skin="tech"] .dash-calendar.week-slide.from-prev .dash-day{animation:gyo-week-prev var(--dur-enter) var(--ease) both;animation-delay:calc((6 - var(--d,0)) * 22ms)}
@keyframes gyo-msg-in{from{opacity:0;transform:translateY(10px)}}
[data-skin="tech"] #view .shadow-message.msg-in{animation:gyo-msg-in 320ms var(--ease) both;animation-delay:calc(var(--m,0) * 80ms)}
/* 2026-10-21 사용자 A: 새로 온 Shadow 답은 문장 덩어리가 차례로 또렷해진다(전체 1.2초 안, 글자는 처음부터 읽기 도구에 있음).
   답을 기다리는 동안 진행 줄의 프로필 둘레가 숨 쉬듯 밝아졌다 어두워진다. 동작 줄이기에서는 둘 다 끈다.
   2026-10-28: 이름이 아래 펼침용 gyo-reveal과 같아 뒤의 것(흐림 없음)에 덮이던 것을 gyo-sharpen으로 분리했다. */
@keyframes gyo-sharpen{from{opacity:0;filter:blur(3px)}to{opacity:1;filter:none}}
[data-skin="tech"] #view .shadow-reveal{animation:gyo-sharpen 420ms var(--ease) both;animation-delay:calc(160ms + var(--r,0) * var(--r-step,90ms))}
@keyframes gyo-breathe{0%,100%{box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 22%,transparent),0 0 0 0 transparent}50%{box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent),0 0 14px 2px color-mix(in srgb,var(--accent) 30%,transparent)}}
[data-skin="tech"] #view .shadow-typing>.shadow-avatar{animation:gyo-breathe 2.4s ease-in-out infinite}
[data-skin="tech"] #view .shadow-confirmation-popup{--glass-pop:var(--bg-elev)}
[data-skin="tech"] #view .shadow-confirmation-popup:not([hidden]):not(.is-leaving) .shadow-confirm-item{animation:gyo-item-in 260ms var(--ease) both;animation-delay:calc(80ms + var(--n,0) * 45ms)}

/* ── Research (2026-10-17): 배치·순서는 그대로, 판·칸·숫자·상승/하락 색만 테크 기준으로 ─────────
   큰 판(경제 일정·종합 해석·지수/환율/공포탐욕/수급 타일·시장 지표·순위)은 유리 판, 판 안 칸은 옅은 면.
   Market Insights(일간·월간)는 고정 배치라 같은 판·칸 규칙만 받는다. */
[data-skin="tech"] #view :is(.rs-body>.rs-panel:not(.rs-market-board),.rs-pulse-call>.rs-panel,.rs-market-tile,.rs-market-pulse>.rs-flow-tile){
  border:1px solid transparent;border-radius:var(--radius);
  background:linear-gradient(var(--glass-surface),var(--glass-surface)) padding-box,var(--edge) border-box;
  box-shadow:var(--shadow);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%)}
[data-skin="tech"] #view :is(.rs-indicator,.rs-allocation,.rs-economic-calendar .rs-economic-daily,.rs-ranking-card,.rs-sentiment-comparisons>div){
  background:var(--bg-soft);border:1px solid var(--glass-line);border-radius:var(--radius-sm);box-shadow:none}
[data-skin="tech"] #view .rs-economic-calendar .rs-economic-grid .rs-calendar-day{border-radius:var(--radius-sm)}
[data-skin="tech"] #view [class*="rs-"] :is(.rs-price,.rs-value,.rs-market-change,td,dd){font-variant-numeric:tabular-nums}
[data-skin="tech"] #view :is(.rs-flow-card,.rs-ranking-card,.rs-market-change) .rs-up,[data-skin="tech"] #view .rs-market-change.rs-up{color:var(--rise)}
[data-skin="tech"] #view :is(.rs-flow-card,.rs-ranking-card) .rs-down,[data-skin="tech"] #view .rs-market-change.rs-down{color:var(--fall)}

/* ── 모션 줄이기·흐림 미지원 ───────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  [data-skin="tech"] body::after{animation:none}
  [data-skin="tech"] .rise,[data-skin="tech"] .is-leaving,[data-skin="tech"] .dash-schedule-popover,[data-skin="tech"] .dash-schedule-popover>*,[data-skin="tech"] #view .shadow-confirmation-popup,[data-skin="tech"] .shadow-work-tooltip,[data-skin="tech"] .menu.open .dropdown,[data-skin="tech"] .site-dialog,[data-skin="tech"] .dash-calendar.week-slide .dash-day,[data-skin="tech"] #view .shadow-message.msg-in,[data-skin="tech"] #view .shadow-reveal,[data-skin="tech"] #view .shadow-typing>.shadow-avatar,[data-skin="tech"] #view .shadow-confirm-item{animation:none!important}
  [data-skin="tech"]::view-transition-old(root),[data-skin="tech"]::view-transition-new(root){animation:none}
  [data-skin="tech"] :is(.menu .dropdown,.shell-notification-panel,#view .shadow-confirmation-popup,dialog:not(.site-inline-panel)),[data-skin="tech"] dialog:not(.site-inline-panel)::backdrop{transition:none}
  [data-skin="tech"] :is(.menu:not(.open) .dropdown,#view .shadow-confirmation-popup[hidden],dialog:not([open]):not(.site-inline-panel)),[data-skin="tech"] dialog:not(.site-inline-panel)::backdrop{animation:none}
  [data-skin="tech"] .site-button,[data-skin="tech"] #view .dash-button,[data-skin="tech"] .nav .links>a,[data-skin="tech"] .dashboard .dash-day,[data-skin="tech"] #view .shadow-work-card,[data-skin="tech"] #view .shadow-work-state,[data-skin="tech"] #view .shadow-composer{transition:none}
  [data-skin="tech"] .site-button:active,[data-skin="tech"] #view .dash-button:active,[data-skin="tech"] .icon-btn:active{transform:none}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  :root[data-skin="tech"]{--glass-surface:var(--bg-elev);--glass-nav:var(--bg-elev);--glass-strong:var(--bg-elev);--glass-pop:var(--bg-elev)}
}

/* ── Profile · Portfolio · Settings · Design Library (2026-10-18) ──
   Dashboard와 같은 유리 판·버튼·팝업·등장 모션. 배치는 그대로 두고 표면만 바꾼다. */
[data-skin="tech"] #view :is(.profile-overview,.profile-intentions,.profile-cards .profile-section,.portfolio-card,.dl-card,.dl-tools){
  border:1px solid transparent;border-radius:var(--radius);
  background:linear-gradient(var(--glass-surface),var(--glass-surface)) padding-box,var(--edge) border-box;box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%)}
[data-skin="tech"] #view .profile-overview{padding:28px}
[data-skin="tech"] #view .profile-intentions{margin:0 0 36px;padding:28px}
[data-skin="tech"] #view .dl-tools{padding:10px 14px}
/* 카드 마우스 반응은 경계와 배경만(가이드 06: 떠오르는 카드 금지). */
[data-skin="tech"] #view :is(.portfolio-card,.dl-card){transition:background var(--dur-base) var(--ease),border-color var(--dur-base) var(--ease)}
[data-skin="tech"] #view :is(.portfolio-card,.dl-card):hover{background:linear-gradient(color-mix(in srgb,var(--accent) 5%,var(--glass-surface)),color-mix(in srgb,var(--accent) 5%,var(--glass-surface))) padding-box,linear-gradient(140deg,color-mix(in srgb,var(--accent) 45%,transparent),var(--glass-line-strong)) border-box}
[data-skin="tech"] #view :is(.portfolio-media,.dl-thumb){background:var(--bg-soft);border-color:var(--glass-line);border-radius:var(--radius-sm)}
[data-skin="tech"] #view .dl-cardfoot{border-top-color:var(--glass-line)}
[data-skin="tech"] #view .dl-hero h1{font-size:var(--fs-xl)}
[data-skin="tech"] #view :is(.profile-fact-group+.profile-fact-group,.profile-intention+.profile-intention){border-left-color:var(--glass-line)}
[data-skin="tech"] #view :is(.profile-tabs,.dl-collections){border-bottom-color:var(--glass-line)}
[data-skin="tech"] #view .dl-collection[aria-selected=true]{background:transparent;border-color:transparent;color:var(--text);box-shadow:inset 0 -2px 0 var(--accent)}
[data-skin="tech"] #view .profile-tree-year-heading span,[data-skin="tech"] #view .profile-tree-period-note{background:var(--bg-elev)}
/* 고정폭은 숫자만 있는 짧은 표시에만. 한국어가 섞인 수정 시각·개수 문장은 같은 폭 숫자만. */
[data-skin="tech"] #view :is(.profile-entry-date,.dl-counter,.portfolio-attachment-count){font-family:var(--font-tech);font-variant-numeric:tabular-nums}
[data-skin="tech"] #view :is(.profile-updated,.dl-count,.profile-tree-year-heading){font-variant-numeric:tabular-nums}
/* 버튼: profile-button·dl 버튼을 공통 테크 버튼과 같게 */
[data-skin="tech"] :is(.profile-button,.dl-action,.dl-close,.portfolio-attachment-trigger){border-radius:var(--radius-sm);border-color:var(--glass-line-strong);background:var(--bg-soft);transition:transform var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
[data-skin="tech"] :is(.profile-button,.dl-action,.dl-close,.portfolio-attachment-trigger):hover:not(:disabled){border-color:color-mix(in srgb,var(--accent) 70%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
[data-skin="tech"] .profile-button.primary{color:#fff;border-color:transparent;background:linear-gradient(180deg,color-mix(in srgb,var(--accent-strong) 88%,#fff),var(--accent-strong));box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 4px 14px color-mix(in srgb,var(--accent-strong) 24%,transparent)}
[data-skin="tech"] .profile-button:active:not(:disabled){transform:scale(.97)}
[data-skin="tech"] #view .profile-tabs .profile-button{background:transparent;box-shadow:none;border-radius:0;border-color:transparent}
[data-skin="tech"] #view .profile-tabs .profile-button:hover:not([aria-selected=true]){color:var(--text);box-shadow:none}
[data-skin="tech"] #view .profile-tabs .profile-button[aria-selected=true]{border-bottom-color:var(--accent)}
[data-skin="tech"] #view .dl-library button:focus-visible{outline-color:var(--accent-2)}
[data-skin="tech"][data-theme="light"] #view .dl-library button:focus-visible{outline-color:var(--accent)}
[data-skin="tech"] :is(.profile-field,.portfolio-field) :is(input,select,textarea),[data-skin="tech"] .profile-interest-register input{background:var(--bg-soft);border-color:var(--glass-line-strong)}
/* 팝업: 판보다 덜 비치는 유리 + 열림 모션 */
[data-skin="tech"] :is(.profile-dialog,.portfolio-dialog,.portfolio-confirm-dialog,.portfolio-video-dialog,.dl-preview,.portfolio-attachment-list,.shell-search-dialog,.dash-dialog){
  border:1px solid transparent;background:linear-gradient(var(--glass-pop),var(--glass-pop)) padding-box,var(--edge) border-box;box-shadow:var(--shadow-lg);
  -webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%)}
[data-skin="tech"] :is(.portfolio-form-header,.portfolio-form-footer,.dl-previewbar+.dl-previewhint){background:var(--glass-pop)}
[data-skin="tech"] .portfolio-form-section{background:var(--bg-soft);border-color:var(--glass-line)}
[data-skin="tech"] :is(.profile-dialog,.portfolio-dialog,.portfolio-confirm-dialog,.portfolio-video-dialog,.dl-preview,.shell-search-dialog,.dash-dialog)::backdrop{background:rgba(2,4,8,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
[data-skin="tech"] :is(.profile-dialog,.portfolio-dialog,.portfolio-confirm-dialog,.portfolio-video-dialog,.dl-preview,.dash-dialog)[open]{animation:gyo-pop-in 220ms var(--ease) both}
[data-skin="tech"] .portfolio-card-attachments[open] .portfolio-attachment-list{animation:gyo-pop-in 220ms var(--ease) both;--pop-origin:top right;transform-origin:top right}
[data-skin="tech"] .portfolio-attachment-chevron{transition:transform var(--dur-base) var(--ease)}
/* 진입 등장: 제목 → 탐색 → 본문 50ms 간격 */
/* 진입 등장: 메뉴 이동 직후(login.js가 1.2초 동안 data-entering)에만. 제목 → 탭 → 본문 50ms 간격. */
[data-skin="tech"][data-entering] #view .site-frame>:is(.site-page-head,.site-page-navigation,.site-page-body){animation:gyo-rise var(--dur-slow) var(--ease) both}
[data-skin="tech"][data-entering] #view .site-frame>.site-page-navigation{animation-delay:50ms}
[data-skin="tech"][data-entering] #view .site-frame>.site-page-body{animation-delay:100ms}
@media (prefers-reduced-motion:reduce){
  [data-skin="tech"] #view .site-frame>*,[data-skin="tech"] :is(.dash-dialog,.profile-dialog,.portfolio-dialog,.portfolio-confirm-dialog,.portfolio-video-dialog,.dl-preview,.portfolio-attachment-list){animation:none!important}
  [data-skin="tech"] #view :is(.portfolio-card,.dl-card),[data-skin="tech"] :is(.profile-button,.dl-action,.dl-close,.portfolio-attachment-chevron){transition:none}
  [data-skin="tech"] .profile-button:active{transform:none}
}
@media(max-width:700px){[data-skin="tech"] #view :is(.profile-overview,.profile-intentions){padding:18px}}
[data-skin="tech"] #view .dl-modes{border-color:var(--glass-line);background:var(--bg-soft);border-radius:var(--radius-sm)}
[data-skin="tech"] #view .dl-modes button{border-radius:var(--radius-xs);transition:background-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
[data-skin="tech"] #view .dl-modes button[aria-pressed=true]{background:var(--glass-strong);border-color:var(--glass-line-strong);color:var(--text);box-shadow:var(--shadow)}

/* ── 화면 안에서 열리는 영역 (2026-10-18) ─────────────────────────
   숨김 해제·<details> 열림·새로 펼친 영역은 짧게 위에서 내려오며 나타난다(가이드 06 '팝업 열림'과 같은 감속).
   닫힘은 즉시: 아래 내용이 바로 제자리로 올라와야 읽기가 끊기지 않는다.
   기존 transform(가운데 정렬 등)을 덮지 않도록 translate 속성만 쓴다.
   display:none에서 다시 보일 때 CSS 애니메이션이 처음부터 다시 시작하는 성질을 쓴다. */
@keyframes gyo-reveal{from{opacity:0;translate:0 -6px}}
@keyframes gyo-fade{from{opacity:0}}
/* 펼침 영역: News 관심사 수정·상태 안내, Research 출처 펼침·선택 요약, Profile 탭 내용 */
[data-skin="tech"] #view :is(.news-interest-editor,.news-status-notice,.news-message,.news-story-candidates,.rs-source-body,.rs-portfolio-selection){animation:gyo-reveal 240ms var(--ease) both}
[data-skin="tech"] #view .profile-tab-panel{animation:gyo-fade 200ms var(--ease) both}
[data-skin="tech"] #view .profile-tab-panel[data-motion="next"]{animation:gyo-week-next 320ms var(--ease) both}
[data-skin="tech"] #view .profile-tab-panel[data-motion="prev"]{animation:gyo-week-prev 320ms var(--ease) both}
[data-skin="tech"] #view .profile-tabs .profile-button{transition:color var(--dur-fast) var(--ease),border-color var(--dur-base) var(--ease)}
/* <details> 열림: 요약 줄 아래 내용만 */
[data-skin="tech"] #view details[open]:not(.portfolio-card-attachments)>:not(summary){animation:gyo-reveal 240ms var(--ease) both}
/* 알림 토스트: 아래에서 올라온다 */
/* 맞춤 수집 창·알림 창: 다른 팝업과 같은 유리와 열림 */
[data-skin="tech"] :is(dialog.news-selection,.shell-notification-panel){border:1px solid transparent;border-radius:var(--radius);
  background:linear-gradient(var(--glass-pop),var(--glass-pop)) padding-box,var(--edge) border-box;box-shadow:var(--shadow-lg);
  -webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%)}
[data-skin="tech"] dialog.news-selection[open]:not(.site-inline-panel){animation:gyo-pop-in 220ms var(--ease) both}
[data-skin="tech"] dialog.news-selection::backdrop{background:rgba(2,4,8,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:gyo-fade 200ms var(--ease) both}
[data-skin="tech"] .shell-notification-panel{transform-origin:top right}
[data-skin="tech"] .shell-notification-panel:not([hidden]){animation:gyo-pop-in 220ms var(--ease) both}
@media (prefers-reduced-motion:reduce){
  [data-skin="tech"] #view :is(.news-interest-editor,.news-status-notice,.news-message,.news-story-candidates,.rs-source-body,.rs-portfolio-selection,.profile-tab-panel),
  [data-skin="tech"] #view details[open]>:not(summary),[data-skin="tech"] dialog.news-selection,[data-skin="tech"] dialog.news-selection::backdrop,[data-skin="tech"] .shell-notification-panel{animation:none!important}
}
/* News 강조 버튼: 다른 강조 버튼과 같은 --accent-strong 바탕(흰 글자 4.5:1 이상). 기존 #5b8cff 바탕은 3.16:1이었다. */
[data-skin="tech"] .news-button.primary{color:#fff;border-color:transparent;background:linear-gradient(180deg,color-mix(in srgb,var(--accent-strong) 88%,#fff),var(--accent-strong));box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 4px 14px color-mix(in srgb,var(--accent-strong) 24%,transparent)}
[data-skin="tech"] .news-button.primary:hover:not(:disabled){color:#fff;border-color:transparent;filter:brightness(1.08)}

/* ── 화면 안 갱신·펼침 2차 (2026-10-18, 사용자 화면 점검) ─────────
   Search·편집·미리보기처럼 페이지 위쪽에 펼치는 영역은 바깥 틀 하나만 내려온다(안쪽 창의 팝업 모션은 끔). */
[data-skin="tech"] .site-expanded-surface{animation:gyo-reveal 240ms var(--ease) both}
[data-skin="tech"] .site-expanded-surface .site-inline-panel[open]{animation:none}
/* Research 도움말 말풍선 */
[data-skin="tech"] .rs-tooltip{animation:gyo-reveal 200ms var(--ease) both}
/* Research 탭 내용: 환율 종류·국내/미국 순위는 버튼은 그대로, 내용만 옅게 바뀐다 */
[data-skin="tech"] #view .rs-fx>:not(.rs-fx-pairs),[data-skin="tech"] #view .rs-ranking-card{animation:gyo-fade 200ms var(--ease) both}
/* Research 시장·경제 일정: 이전/다음은 누른 방향에서 칸이 밀려 들어오고(Dashboard 주 이동과 같은 값), 보기·조건 변경은 옅게. 날짜 선택은 아래 내용만. */
[data-skin="tech"] #view .rs-economic-grid .rs-calendar-day:nth-child(7n+2){--d:1}
[data-skin="tech"] #view .rs-economic-grid .rs-calendar-day:nth-child(7n+3){--d:2}
[data-skin="tech"] #view .rs-economic-grid .rs-calendar-day:nth-child(7n+4){--d:3}
[data-skin="tech"] #view .rs-economic-grid .rs-calendar-day:nth-child(7n+5){--d:4}
[data-skin="tech"] #view .rs-economic-grid .rs-calendar-day:nth-child(7n+6){--d:5}
[data-skin="tech"] #view .rs-economic-grid .rs-calendar-day:nth-child(7n+7){--d:6}
[data-skin="tech"] #view .rs-economic-grid[data-motion="next"] .rs-calendar-day{animation:gyo-week-next 340ms var(--ease) both;animation-delay:calc(var(--d,0) * 22ms)}
[data-skin="tech"] #view .rs-economic-grid[data-motion="prev"] .rs-calendar-day{animation:gyo-week-prev 340ms var(--ease) both;animation-delay:calc((6 - var(--d,0)) * 22ms)}
[data-skin="tech"] #view .rs-economic-grid[data-motion="fade"] .rs-calendar-day{animation:gyo-fade 200ms var(--ease) both}
[data-skin="tech"] #view .rs-economic-details>*{animation:gyo-fade 200ms var(--ease) both}
/* Design Library 분야 탭: 내용만 옅게 바뀐다(진입 등장은 메뉴 이동 때만) */
[data-skin="tech"] #view .dl-library>.site-page-body{animation:gyo-fade 200ms var(--ease) both}
/* 누름·마우스 반응이 즉시 바뀌던 조작: 색·경계만 짧게 */
[data-skin="tech"] :is(.nav .icon-btn,.nav .nav-search,.news-button,.rs-calendar-day,.rs-fx-pair,.rs-chart-period,.rs-economic-calendar .btn,.rs-label,.dl-collection,#view select),[data-skin="tech"] #view details>summary{transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
[data-skin="tech"] :is(#view a,.nav a.brand){transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),opacity var(--dur-fast) var(--ease)}
/* 상단바 창은 아직 테크 기준이 아닌 화면(Workspace)에서도 같은 모션으로 열린다 */
:root:not([data-skin="tech"]) .menu.open .dropdown,:root:not([data-skin="tech"]) .shell-notification-panel:not([hidden]),:root:not([data-skin="tech"]) .site-expanded-surface:has(.shell-search-dialog){animation:gyo-reveal 220ms cubic-bezier(.16,1,.3,1) both}
:root:not([data-skin="tech"]) .nav :is(.icon-btn,.nav-search){transition:color 140ms cubic-bezier(.16,1,.3,1),background-color 140ms cubic-bezier(.16,1,.3,1),border-color 140ms cubic-bezier(.16,1,.3,1)}
@media (prefers-reduced-motion:reduce){
  [data-skin="tech"] .site-expanded-surface,[data-skin="tech"] .rs-tooltip,[data-skin="tech"] #view .rs-fx>*,[data-skin="tech"] #view .rs-ranking-card,[data-skin="tech"] #view .rs-economic-grid .rs-calendar-day,[data-skin="tech"] #view .rs-economic-details>*,[data-skin="tech"] #view .dl-library>.site-page-body,
  :root:not([data-skin="tech"]) .menu.open .dropdown,:root:not([data-skin="tech"]) .shell-notification-panel,:root:not([data-skin="tech"]) .site-expanded-surface{animation:none!important}
  [data-skin="tech"] :is(.nav .icon-btn,.nav .nav-search,.news-button,.rs-calendar-day,.rs-fx-pair,.rs-chart-period,.rs-economic-calendar .btn,.rs-label,.dl-collection,#view select),[data-skin="tech"] #view details>summary,[data-skin="tech"] :is(#view a,.nav a.brand),:root:not([data-skin="tech"]) .nav :is(.icon-btn,.nav-search){transition:none}
}

/* ── Workspace (2026-10-18): 배치·크기는 그대로, 표면·제목·진행 단계만 테크 기준으로 ── */
[data-skin="tech"] #view .ws-phase1-stat,[data-skin="tech"] #view .wsu-card{border:1px solid transparent;
  background:linear-gradient(var(--glass-surface),var(--glass-surface)) padding-box,var(--edge) border-box;box-shadow:var(--shadow);
  transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-base) var(--ease)}
[data-skin="tech"] #view .wsu-card:hover{box-shadow:0 0 0 1px var(--glass-line-strong),var(--shadow)}
[data-skin="tech"] #view .wsu-featured-title{font-size:var(--fs-lg);font-weight:650;color:var(--text)}
[data-skin="tech"] #view .wsu-state-card .wsu-pipeline [data-state=working]{background:none}
@media (prefers-reduced-motion:reduce){[data-skin="tech"] #view .wsu-card{transition:none}}
[data-skin="tech"] #view .ws-phase1-stat dd,[data-skin="tech"] #view .wsu-summary>strong{font-variant-numeric:tabular-nums}
[data-skin="tech"] #view .wsu-summary>strong{font-size:var(--fs-sm);font-weight:600;color:var(--text-soft);font-family:var(--font-tech)}

/* ── 화면별 요소 정돈 (2026-10-18, 탭·페이지 전수 점검) ─────────── */
/* Workspace: 카드·판은 다른 화면과 같은 유리 판. 판 안의 작은 칸은 유리를 겹치지 않고 옅은 바탕만. */
[data-skin="tech"] #view :is(.ws-phase1-stat,.wsu-card,.ws-project-overview,.ws-stat-card,.ws-project-directory){
  border:1px solid transparent;border-radius:var(--radius);
  background:linear-gradient(var(--glass-surface),var(--glass-surface)) padding-box,var(--edge) border-box;box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%)}
[data-skin="tech"] #view :is(.ws-phase1-state,.wps-current,.wps-proof-body,.wps-state){background:var(--bg-soft);border-color:var(--glass-line)}
[data-skin="tech"] .wsu-error-dialog{border:1px solid transparent;border-radius:var(--radius);background:linear-gradient(var(--glass-pop),var(--glass-pop)) padding-box,var(--edge) border-box;box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(24px) saturate(150%);backdrop-filter:blur(24px) saturate(150%)}
/* 입력 칸: 모든 화면에서 같은 모서리·테두리·바탕(News 검색 묶음·Shadow 입력처럼 바깥 틀이 있는 칸은 제외) */
[data-skin="tech"] #view :is(select,textarea,input:is([type=text],[type=search],[type=email],[type=url],[type=number],[type=date],[type=tel],:not([type]))):not(.news-search-wrap *):not(.shadow-composer *){border-radius:var(--radius-xs);border-color:var(--glass-line-strong);background-color:var(--bg-soft)}
[data-skin="tech"] #view :is(select,textarea,input):not(.news-search-wrap *):not(.shadow-composer *):focus{border-color:var(--accent)}
/* 빈 상태: 화면마다 달랐던 모양(점선 상자·평문·판)을 하나로 */
[data-skin="tech"] #view :is(.site-empty,.portfolio-empty,.news-empty,.ws-empty,.wsr-empty,.wps-empty,.rs-body>.rs-empty,.site-page-body>.rs-empty){margin:0;padding:var(--ui-section-gap);border:1px dashed var(--glass-line-strong);border-radius:var(--radius-sm);background:var(--bg-soft);box-shadow:none;color:var(--text-soft);-webkit-backdrop-filter:none;backdrop-filter:none}
/* Research: 작은 칩·구간 버튼 모서리를 가이드 값으로, '자료 확인' 칩 글자 대비 보완 */
[data-skin="tech"] #view .rs-label{border-radius:var(--radius-xs);border-color:var(--glass-line-strong);background:var(--bg-soft);color:var(--text-soft)}
/* 해석 라벨은 의미별 색(안정=초록·주의=노랑·경고=빨강). 위 공통 규칙이 색을 덮어 모두 회색이 됐던 것을 되돌린다 */
[data-skin="tech"] #view .rs-label.rs-safe{color:var(--ok);background:var(--ok-soft);border-color:var(--ok)}
[data-skin="tech"] #view .rs-label.rs-caution{color:var(--warn);background:var(--warn-soft);border-color:var(--warn)}
[data-skin="tech"] #view .rs-label.rs-warning{color:var(--danger);background:var(--danger-soft);border-color:var(--danger)}
[data-skin="tech"] #view .rs-label.rs-unknown{color:var(--text-mute)}
/* 월↔주 전환: 달력 칸 전체가 위로 살짝 떠오르며 나타난다 */
@keyframes gyo-view{from{opacity:0;transform:translateY(10px) scale(.985)}}
[data-skin="tech"] #view .rs-economic-grid[data-motion="view"]{animation:gyo-view 320ms var(--ease) both}
[data-skin="tech"] #view .rs-economic-grid[data-motion="view"] .rs-calendar-day{animation:gyo-fade 260ms var(--ease) both;animation-delay:calc(var(--d,0) * 18ms)}
@media (prefers-reduced-motion:reduce){[data-skin="tech"] #view .rs-economic-grid[data-motion="view"],[data-skin="tech"] #view .rs-economic-grid[data-motion="view"] .rs-calendar-day{animation:none!important}}
/* 종합 해석: 한눈에 보이는 결론 + 요점 목록 */
[data-skin="tech"] #view .rs-market-summary{border-color:var(--accent);background:linear-gradient(var(--accent-soft),var(--accent-soft)),var(--glass-surface)}
[data-skin="tech"] #view .rs-market-summary .rs-summary-lead{font-size:var(--fs-lg);font-weight:650;line-height:1.55;color:var(--text);margin:0 0 14px}
[data-skin="tech"] #view .rs-market-summary .rs-summary-point{position:relative;margin:0 0 10px;padding-left:16px;font-size:14px;line-height:1.75;color:var(--text-soft)}
[data-skin="tech"] #view .rs-market-summary .rs-summary-point::before{content:'';position:absolute;left:2px;top:.75em;width:5px;height:5px;border-radius:50%;background:var(--accent)}
[data-skin="tech"] #view :is(.rs-fx-pair,.rs-chart-period){border-radius:var(--radius-xs)}
[data-skin="tech"] #view .rs-economic-day-number{border-radius:var(--radius-sm)}[data-skin="tech"] #view .rs-economic-count{border-radius:var(--radius-xs)}
[data-skin="tech"] #view .news-search-wrap:not(:focus-within){border-color:var(--glass-line-strong)}
/* 한국어가 섞인 개수 문장은 고정폭 대신 같은 폭 숫자만(가이드 04) */[data-skin="tech"] #view .wsu-summary>strong{font-family:inherit}

/* ── Market Insights (2026-10-18): 배치·크기는 그대로, 모션·효과만 ──
   Daily Brief 달력의 이전/다음/오늘은 시장 달력과 같은 data-motion 규칙을 쓴다. 날짜를 고르면 아래 글만 옅게 바뀐다.
   Monthly Trend는 주차 전환·월 목록 열림·진행 표시만 움직인다. */
@keyframes gyo-spin{to{transform:rotate(360deg)}}
[data-skin="tech"] #view .rs-daily-reference>.rs-brief-body{animation:gyo-fade 200ms var(--ease) both}
[data-skin="tech"] #view .rs-monthly-reference .mi-week:not([hidden]){animation:gyo-fade 200ms var(--ease) both}
[data-skin="tech"] #view .mi-month-list:not([hidden]){animation:gyo-reveal 200ms var(--ease) both}
[data-skin="tech"] #view .rs-monthly-reference .mi-status-ring{animation:gyo-spin 1.6s linear infinite}
[data-skin="tech"] #view :is(.mi-stop,.mi-month-button,.mi-month-option,.site-tabs a){transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
[data-skin="tech"] #view button.mi-stop:active:not(:disabled),[data-skin="tech"] #view .rs-daily-reference .rs-calendar-day:active:not(:disabled){transform:scale(.97)}
@media (prefers-reduced-motion:reduce){
  [data-skin="tech"] #view :is(.rs-daily-reference>.rs-brief-body,.rs-monthly-reference .mi-week,.mi-month-list,.rs-monthly-reference .mi-status-ring){animation:none!important}
  [data-skin="tech"] #view :is(.mi-stop,.mi-month-button,.mi-month-option,.site-tabs a){transition:none}
  [data-skin="tech"] #view button.mi-stop:active,[data-skin="tech"] #view .rs-daily-reference .rs-calendar-day:active{transform:none}
}
@media (prefers-reduced-motion:reduce){[data-skin="tech"] #view .profile-tabs .profile-button{transition:none}}

/* ── News (2026-10-19): 배치는 그대로, 목록 갱신·행 반응·순위 전환 모션 ──
   필터·검색·쪽 이동으로 목록이 다시 그려지면 앞의 10건이 차례로 옅게 나타난다. 순위 분야 전환은 내용만 옅게. */
[data-skin="tech"] #view .news-list>.news-item{animation:gyo-fade 220ms var(--ease) both}
[data-skin="tech"] #view .news-list>.news-item:nth-child(2){animation-delay:30ms}[data-skin="tech"] #view .news-list>.news-item:nth-child(3){animation-delay:60ms}
[data-skin="tech"] #view .news-list>.news-item:nth-child(4){animation-delay:90ms}[data-skin="tech"] #view .news-list>.news-item:nth-child(5){animation-delay:120ms}
[data-skin="tech"] #view .news-list>.news-item:nth-child(6){animation-delay:150ms}[data-skin="tech"] #view .news-list>.news-item:nth-child(7){animation-delay:180ms}
[data-skin="tech"] #view .news-list>.news-item:nth-child(8){animation-delay:210ms}[data-skin="tech"] #view .news-list>.news-item:nth-child(9){animation-delay:240ms}
[data-skin="tech"] #view .news-list>.news-item:nth-child(n+10){animation-delay:270ms}
[data-skin="tech"] #view .news-ranking-body{animation:gyo-fade 200ms var(--ease) both}
[data-skin="tech"] #view .news-item{transition:background-color var(--dur-base) var(--ease),border-color var(--dur-base) var(--ease)}
[data-skin="tech"] #view .news-item:hover{background-color:color-mix(in srgb,var(--accent) 4%,var(--bg-elev))}
[data-skin="tech"] #view .news-selected-count:not(:empty){animation:gyo-fade 160ms var(--ease) both}
[data-skin="tech"] #view .news-ranking-tabs .news-button{transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
@media (prefers-reduced-motion:reduce){
  [data-skin="tech"] #view :is(.news-list>.news-item,.news-ranking-body,.news-selected-count){animation:none!important}
  [data-skin="tech"] #view :is(.news-item,.news-ranking-tabs .news-button){transition:none}
}

/* ── 모션 2단계 (2026-10-28): 늦게 들어온 화면을 같은 결로 ───────────
   버튼: 따로 정한 전환이 없는 버튼만 링크와 같은 짧은 색·경계 전환(:where라 화면별 규칙이 항상 이긴다).
   내용 도착: Workspace 목록 카드는 4px 아래에서 차례로(최대 6개, 40ms 간격), 보고서 본문·뉴스 상세는 옅게.
   필터·탭으로 다시 그릴 때도 내용만 바뀐다(진입 등장은 다시 쓰지 않음). 보고서 틀(8차 시안) 안쪽은 건드리지 않는다. */
:where([data-skin="tech"] #view button){transition:color var(--dur-fast) var(--ease),background-color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
[data-skin="tech"] #view .wsu-cards>li{animation:gyo-item-in 260ms var(--ease) both}
[data-skin="tech"] #view .wsu-cards>li:nth-child(2){animation-delay:40ms}
[data-skin="tech"] #view .wsu-cards>li:nth-child(3){animation-delay:80ms}
[data-skin="tech"] #view .wsu-cards>li:nth-child(4){animation-delay:120ms}
[data-skin="tech"] #view .wsu-cards>li:nth-child(5){animation-delay:160ms}
[data-skin="tech"] #view .wsu-cards>li:nth-child(n+6){animation-delay:200ms}
[data-skin="tech"] #view :is(.wsr-reader-frame,.news-story-detail>*){animation:gyo-fade 240ms var(--ease) both}
@media (prefers-reduced-motion:reduce){
  :where([data-skin="tech"] #view button){transition:none}
  [data-skin="tech"] #view :is(.wsu-cards>li,.wsr-reader-frame,.news-story-detail>*){animation:none!important}
}
@media(max-width:600px){[data-skin="tech"] .nav .links>a[aria-current="page"]::after{left:4px;right:4px}}