/* Be Artist — visual system 2026-11
   Paper / ink base, one accent at a time. Switch with [data-accent="gold"|"orange"].
   Layout, copy and behavior stay identical between accents. */

:root{
  --paper:#F7F5F0;
  --paper-2:#FBF9F5;
  --wash:#EFEBE3;
  --panel:#FFFFFF;
  --ink:#14110E;
  --ink-2:#2A251F;
  --muted:#6F675B;
  --muted-2:#8C8477;
  --line:#E6E1D7;
  --line-strong:#D2CBBD;
  --accent:#B8862F;
  --accent-ink:#8A5E12;
  --accent-soft:#F4E9D0;
  --on-accent:#14110E;
  --radius:16px;
  --shadow:0 26px 60px -44px rgba(20,17,14,.5);
  --serif:"Songti SC","Noto Serif SC","Hiragino Mincho ProN",Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Hiragino Sans GB","Noto Sans CJK SC","Yu Gothic",sans-serif;
  --max:1240px;
  --gutter:clamp(20px,4vw,48px);
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  color-scheme:light;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
:root[data-bg="white"]{
  --paper:#FFFFFF;
  --paper-2:#FBFAF7;
  --wash:#F4F3EF;
  --line:#E9E6DE;
  --line-strong:#D6D2C8;
}
:root[data-accent="orange"]{
  --accent:#E1551C;
  --accent-ink:#14110E;
  --accent-soft:#FBE4D7;
  --on-accent:#FFFFFF;
}
:root[data-accent="orange"] .detail-link,
:root[data-accent="orange"] .text-button{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-size:15px;line-height:1.6}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button,a,input,summary,select{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
kbd{font-family:var(--sans)}

/* ---------- header ---------- */
.site-header{
  position:sticky;top:0;z-index:60;
  display:flex;align-items:center;gap:26px;
  height:64px;
  padding:0 max(20px,calc((100vw - var(--max))/2 + var(--gutter)));
  background:var(--ink);color:#F7F5F0;
}
.brand{order:1;display:inline-flex;align-items:center;gap:7px;color:#fff;font-size:19px;font-weight:700;letter-spacing:-.035em}
.brand-dot{width:6px;height:6px;border-radius:50%;background:var(--accent)}
.main-nav{order:2;display:flex;align-items:center;gap:2px;min-width:0}
.main-nav a{position:relative;font-size:12.5px;letter-spacing:.02em;color:#B5AC9E;padding:8px 12px;border-radius:999px;white-space:nowrap;transition:color .15s,background .15s}
.main-nav a:hover{color:#fff;background:#ffffff10}
.main-nav a.selected{color:#fff}
.main-nav a.selected:after{content:"";position:absolute;left:12px;right:12px;bottom:3px;height:2px;border-radius:2px;background:var(--accent)}
.header-link{order:3;margin-left:auto;color:#A79E90;font-size:11.5px;letter-spacing:.02em;white-space:nowrap;transition:color .15s}
.header-link:hover{color:#fff}
.site-header .bg-toggle{order:5}
.site-header .language-switch{order:6}
.site-header .theme-toggle{order:4}

.theme-toggle{display:flex;align-items:center;gap:2px;padding:2px;border:1px solid #3A342B;border-radius:999px;background:#1D1915}
.theme-toggle button{display:inline-flex;align-items:center;gap:5px;border:0;border-radius:999px;background:transparent;color:#A79E90;font-size:10.5px;padding:4px 8px;min-height:26px;line-height:1}
.theme-toggle button:hover{color:#fff}
.theme-toggle button[aria-pressed="true"]{background:#F7F5F0;color:var(--ink)}
.theme-toggle i{display:block;width:9px;height:9px;border-radius:50%}
.bg-toggle{display:flex;align-items:center;gap:2px;padding:2px;border:1px solid #3A342B;border-radius:999px;background:#1D1915}
.bg-toggle button{display:inline-flex;align-items:center;gap:5px;border:0;border-radius:999px;background:transparent;color:#A79E90;font-size:10.5px;padding:4px 8px;min-height:26px;line-height:1}
.bg-toggle button:hover{color:#fff}
.bg-toggle button[aria-pressed="true"]{background:#F7F5F0;color:var(--ink)}
.bg-toggle i{display:block;width:9px;height:9px;border-radius:2px;border:1px solid #6B6255}
.bg-toggle button[data-bg="cream"] i{background:#F3EBDD}
.bg-toggle button[data-bg="white"] i{background:#FFFFFF}
.theme-toggle button[data-accent="gold"] i{background:#C9973F}
.theme-toggle button[data-accent="orange"] i{background:#E1551C}

.language-switch{display:flex;align-items:center;gap:2px;padding:2px;border:1px solid #3A342B;border-radius:999px;background:#1D1915;flex-shrink:0}
.language-switch button{border:0;border-radius:999px;background:transparent;color:#A79E90;font-size:10.5px;padding:4px 9px;min-height:26px;line-height:1;white-space:nowrap}
.language-switch button[aria-pressed="true"]{background:#F7F5F0;color:var(--ink)}

/* ---------- page frame ---------- */
main{max-width:var(--max);margin:0 auto;padding:0 var(--gutter) 88px}
main>[data-view]:not([hidden]){display:block}

/* ---------- hero ---------- */
.intro{padding:clamp(42px,7vw,78px) 0 clamp(24px,4vw,36px)}
.eyebrow{display:inline-block;font-size:11px;letter-spacing:.16em;color:var(--muted-2);text-transform:none}
.intro h1{
  display:block;
  margin:10px 0 16px;
  word-spacing:-.06em;
  font-size:clamp(62px,11.4vw,156px);
  line-height:.9;letter-spacing:-.055em;font-weight:640;color:var(--ink);
}
.intro h1 em{
  display:inline;font-family:inherit;font-style:normal;font-weight:inherit;
  font-size:1em;line-height:inherit;letter-spacing:inherit;color:var(--accent);
  margin:0;padding:0;transform:none;vertical-align:baseline;
}
.hero-dot{color:var(--accent);margin-left:.01em}
.intro-bottom{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-top:1px solid var(--line);padding-top:13px}
.intro p{font-size:15px;line-height:1.7;color:var(--muted);margin:0}
.intro-meta{font-size:10.5px;letter-spacing:.08em;color:var(--muted-2);white-space:nowrap}

/* ---------- front row: ad slots + short lists ---------- */
.front-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 clamp(34px,5vw,56px)}
.ad-slot{
  position:relative;display:block;min-height:186px;padding:0;overflow:hidden;
  border-radius:12px;background:var(--wash);color:var(--muted);
}
.ad-slot img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.ad-slot:after{content:"";position:absolute;left:0;right:0;bottom:0;height:44%;background:linear-gradient(180deg,transparent,rgba(10,9,7,.46));pointer-events:none}
.ad-inline{grid-column:1/-1;min-height:120px}
.ad-slot.is-empty{min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:20px 16px;border:1px dashed var(--line-strong);background:var(--wash);text-align:center}
.ad-slot.is-empty:after{display:none}
.ad-slot.is-empty p{margin:0;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--ink-2)}
.ad-slot.is-empty small{font-size:9px;line-height:1.6;color:var(--muted-2)}
.ad-note{position:absolute;left:10px;bottom:9px;z-index:2;padding:3px 7px;border-radius:999px;background:rgba(14,13,12,.42);color:#fff;font-size:9px;letter-spacing:.03em;line-height:1.5}
.ad-tag{position:absolute;right:10px;top:10px;z-index:2;font-size:8.5px;letter-spacing:.16em;padding:2px 6px;border:0;border-radius:4px;background:rgba(255,255,255,.92);color:var(--muted-2)}
.ad-size{font-size:9.5px;letter-spacing:.14em;color:var(--muted-2)}
.ad-slot p{margin:0;font-size:13px;font-weight:600;color:var(--ink-2);letter-spacing:.02em}
.ad-slot small{font-size:9px;color:var(--muted-2);line-height:1.6}
.front-list{min-width:0;border-top:2px solid var(--ink);padding-top:11px}
.front-title{display:flex;align-items:center;gap:8px;margin:0 0 4px;font-family:var(--sans);font-size:12.5px;font-weight:700;letter-spacing:.1em;line-height:1.4;color:var(--accent-ink)}
.front-title i{display:block;width:12px;height:3px;border-radius:2px;background:var(--accent);flex:none}
.front-items{display:flex;flex-direction:column}
.front-item{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;gap:1px 10px;align-items:center;width:100%;padding:9px 0;text-align:left;background:none;border:0;border-bottom:1px solid var(--line)}
.front-item:hover strong{color:var(--accent-ink)}
.fi-region{grid-column:1;grid-row:1;font-size:9px;letter-spacing:.1em;color:var(--muted-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fi-date{grid-column:2;grid-row:1 / span 2;font-size:9.5px;color:var(--accent-ink);font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right;max-width:74px;line-height:1.45}
.front-item strong{grid-column:1;grid-row:2;font-size:12px;font-weight:600;line-height:1.45;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.front-empty{font-size:10.5px;line-height:1.8;color:var(--muted-2);padding:12px 0}

/* ---------- search panel ---------- */
.search-section{position:relative;z-index:2;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:clamp(20px,3vw,30px);box-shadow:var(--shadow)}
.search-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.search-head h2{margin:0;font-size:20px;font-weight:650;letter-spacing:-.02em}
.data-note{font-size:10px;letter-spacing:.05em;color:var(--muted-2);text-align:right;line-height:1.6}
.query-wrap{display:flex;align-items:center;gap:11px;min-height:52px;padding:0 15px;margin:18px 0 12px;background:var(--paper-2);border:1px solid var(--line);border-radius:12px;transition:border-color .15s,box-shadow .15s,background .15s}
.query-wrap:focus-within{border-color:var(--accent);background:#fff;box-shadow:0 0 0 3px var(--accent-soft)}
.query-wrap svg{width:17px;height:17px;fill:none;stroke:var(--muted);stroke-width:1.6;flex:none}
.query-wrap input{flex:1;min-width:0;height:50px;border:0;outline:none;background:transparent;color:var(--ink);font-size:14px}
.query-wrap input::placeholder{color:var(--muted-2)}
.query-wrap kbd{padding:2px 5px;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--muted-2);font-size:9.5px;letter-spacing:.04em}

/* ---------- filters ---------- */
.filter-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.filter{position:relative;min-width:0}
.filter-trigger{display:flex;align-items:center;gap:6px;width:100%;height:44px;padding:0 12px;border:1px solid transparent;border-radius:10px;background:var(--paper-2);color:var(--ink-2);font-size:12px;text-align:left;transition:border-color .15s,background .15s,color .15s}
.filter-trigger:hover{border-color:var(--line-strong)}
.filter-trigger.active{padding-right:9px;background:var(--accent-soft);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.filter-trigger.open{border-color:var(--accent);background:#fff}
.chevron{width:6px;height:6px;margin-left:auto;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .15s;flex:none;opacity:.6}
.filter-trigger.open .chevron{transform:rotate(-135deg)}
.selected-summary{max-width:62px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;font-weight:600;padding:2px 6px;border-radius:999px;background:var(--accent);color:var(--on-accent)}
.menu{position:absolute;top:calc(100% + 6px);left:0;z-index:40;width:min(280px,calc(100vw - 48px));padding:12px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 50px -20px rgba(20,17,14,.35)}
.filter:nth-child(5n) .menu,.filter:nth-child(5n-1) .menu{left:auto;right:0}
.menu-title{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 8px;font-size:10px;color:var(--muted-2)}
.menu-scroll{display:flex;flex-direction:column;gap:1px;max-height:272px;overflow:auto;overscroll-behavior:contain}
.menu-option{display:flex;align-items:center;gap:9px;padding:8px 6px;border-radius:7px;font-size:12px;color:var(--ink-2);cursor:pointer}
.menu-option:hover{background:var(--paper)}
.menu-option input{width:14px;height:14px;accent-color:var(--accent);flex:none}
.menu-option span{min-width:0}
.menu-option small{margin-left:auto;font-size:9.5px;color:var(--muted-2);font-variant-numeric:tabular-nums}
.menu-note{margin:8px 4px 2px;padding-top:8px;border-top:1px solid var(--line);font-size:10px;line-height:1.7;color:var(--muted-2)}

.filter-help{display:flex;justify-content:space-between;gap:12px;margin-top:12px;font-size:10px;color:var(--muted-2)}
.active-filters{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.active-filters:empty{display:none}
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid var(--accent);border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);font-size:10.5px}
.chip span{font-size:12px;line-height:1}
.chip:hover{background:var(--accent);color:var(--on-accent)}

.catalog-scope{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.scope-button{padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);font-size:10.5px;line-height:1.3;transition:border-color .15s,color .15s,background .15s}
.scope-button:hover{border-color:var(--accent);color:var(--accent-ink)}
.scope-button.selected{background:var(--ink);border-color:var(--ink);color:var(--paper)}

.admission-help{margin:14px 0 0;font-size:10.5px;line-height:1.8;color:var(--muted-2)}
.admission-help button{margin-left:8px}
.text-button{border:0;background:none;padding:0;color:var(--accent-ink);font-size:11px;line-height:1.5;text-decoration:none}
.text-button:hover{text-decoration:underline;text-underline-offset:3px}
.text-button[disabled]{color:var(--muted-2);opacity:.5;cursor:not-allowed;text-decoration:none}

/* ---------- results ---------- */
.results-section{margin-top:clamp(28px,4vw,46px)}
.results-bar{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding-bottom:11px;margin-bottom:18px;border-bottom:1px solid var(--line)}
.results-bar h2{margin:0;font-size:18px;font-weight:600;letter-spacing:-.01em}
.results-bar h2 span{font-family:var(--serif);font-size:30px;font-weight:600;color:var(--accent-ink);margin-right:2px}
.results-bar>span{font-size:10px;letter-spacing:.08em;color:var(--muted-2);white-space:nowrap}
.results-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.results-grid .empty{grid-column:1/-1}

.card{display:flex;flex-direction:column;padding:20px 22px 18px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);transition:border-color .18s,box-shadow .18s,transform .18s}
.card:hover{border-color:var(--accent);box-shadow:0 22px 44px -34px rgba(20,17,14,.55);transform:translateY(-2px)}
.card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;font-size:9.5px;letter-spacing:.1em;color:var(--muted-2)}
.card-top>span:first-child{min-width:0;overflow-wrap:anywhere}
.status-stack{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:none}
.status{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border-radius:999px;background:var(--paper);color:var(--muted);font-size:9.5px;font-weight:600;letter-spacing:.04em;white-space:nowrap}
.status:before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.status:not(.upcoming):not(.closed):not(.unknown){background:var(--accent-soft);color:var(--accent-ink)}
.status.upcoming{background:var(--wash);color:var(--ink-2)}
.status.closed{background:transparent;color:var(--muted-2)}
.status.unknown{background:transparent;border:1px dashed var(--line-strong);color:var(--muted-2)}
.deadline-countdown{font-size:9.5px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.deadline-countdown.urgent{color:var(--accent-ink);font-weight:700}
.card h3{margin:12px 0 6px;font-size:19px;font-weight:650;line-height:1.4;letter-spacing:-.02em}
.card .edition{margin:0 0 12px;font-size:10.5px;line-height:1.6;color:var(--muted-2)}
.legacy-label{color:#94683A}
.checked-label{color:var(--muted)}
.admission-row{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:0 0 10px}
.admission-label{padding:4px 7px;border-radius:5px;background:var(--paper);color:var(--muted);font-size:9px;font-weight:600;letter-spacing:.03em}
.admission-label.core{background:var(--accent-soft);color:var(--accent-ink)}
.admission-label.practice{background:var(--wash);color:#5C6653}
.admission-condition{font-size:9px;color:var(--muted-2)}
.card-description{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 14px;font-size:12.5px;line-height:1.75;color:#5E574C;min-height:0}
.card-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:11px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.card-meta small{display:block;margin-bottom:3px;font-size:8.5px;letter-spacing:.1em;color:var(--muted-2)}
.card-meta b{display:block;font-size:11.5px;font-weight:600;line-height:1.55;color:var(--ink-2)}
.score-row{display:grid;grid-template-columns:repeat(3,1fr);padding:11px 0}
.score-item{padding:0 12px;border-left:1px solid var(--line);min-width:0}
.score-item:first-child{padding-left:0;border-left:0}
.score-item span{display:block;margin-bottom:2px;font-size:8.5px;letter-spacing:.08em;color:var(--muted-2)}
.score-item b{font-family:var(--serif);font-size:20px;font-weight:600;line-height:1.15;color:var(--ink);font-variant-numeric:tabular-nums}
.score-item b small{margin-left:2px;font-family:var(--sans);font-size:8px;font-weight:400;color:var(--muted-2)}
.card-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}
.card-tags span{padding:3px 7px;border:1px solid var(--line);border-radius:999px;background:var(--paper-2);color:var(--muted);font-size:9px;line-height:1.5}
.tag-more{border:0;background:none;padding:4px 2px;color:var(--accent-ink);font-size:9.5px}
.card-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:auto;padding-top:2px}
.cost-warning{max-width:66%;font-size:9px;line-height:1.65;color:var(--muted-2)}
.detail-link{display:inline-flex;align-items:center;gap:4px;border:0;background:none;padding:0;color:var(--accent-ink);font-size:11px;font-weight:600;white-space:nowrap}
.detail-link:hover{text-decoration:underline;text-underline-offset:3px}

.method-note{display:grid;grid-template-columns:112px minmax(0,1fr) auto;gap:18px;align-items:start;margin-top:28px;padding-top:20px;border-top:1px solid var(--line)}
.method-label{font-size:9.5px;letter-spacing:.12em;color:var(--muted-2);padding-top:2px}
.method-note p{margin:0;font-size:11px;line-height:1.9;color:var(--muted)}
.method-note button{align-self:start}

/* ---------- empty / loading / error ---------- */
.empty{padding:42px 24px;border:1px dashed var(--line-strong);border-radius:14px;background:var(--paper-2);text-align:center}
.empty h3{margin:0 0 8px;font-size:16px;font-weight:600}
.empty p{margin:0 0 16px;font-size:11.5px;line-height:1.85;color:var(--muted)}
.empty button{padding:9px 16px;border:1px solid var(--ink);border-radius:999px;background:var(--ink);color:var(--paper);font-size:11px}
.empty button:hover{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.skeleton-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.skeleton-card{height:236px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(100deg,var(--panel) 28%,var(--wash) 48%,var(--panel) 68%);background-size:220% 100%;animation:skeleton 1.5s ease-in-out infinite}
@keyframes skeleton{to{background-position:-220% 0}}

/* ---------- sections shared ---------- */
.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin:0 0 22px}
.section-heading h2{margin:0;font-size:24px;font-weight:650;letter-spacing:-.02em}
.section-note{margin:30px 0 0;font-size:10.5px;line-height:1.9;color:var(--muted-2)}

/* ---------- resources ---------- */
.resource-search{max-width:560px;background:#fff;margin:0 0 16px}
.resource-bar{margin-top:32px}
#resource-results{align-items:start}
.resource-card .eyebrow{font-size:9.5px;letter-spacing:.12em;color:var(--accent-ink)}
.resource-card h3{font-size:20px;margin-top:8px}
.resource-card .card-description{min-height:46px}
.resource-card .card-bottom{margin-top:12px}

/* ---------- guide ---------- */
.guide-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:8px 0 38px}
.guide-steps article{border-top:2px solid var(--ink);padding-top:14px}
.guide-steps small{font-size:9.5px;letter-spacing:.1em;color:var(--accent-ink)}
.guide-steps h3{margin:12px 0 8px;font-size:17px;font-weight:600}
.guide-steps p{margin:0;font-size:12px;line-height:1.9;color:var(--muted)}
.document-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.document-card{position:relative;padding:22px 44px 22px 22px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);text-align:left;transition:border-color .15s,background .15s}
.document-card:hover{border-color:var(--accent);background:var(--paper-2)}
.document-card span{font-size:16px;font-weight:600}
.document-card p{margin:6px 0 0;font-size:11px;line-height:1.8;color:var(--muted)}
.document-card b{position:absolute;right:20px;top:20px;font-weight:400;color:var(--muted-2)}

/* ---------- dialog ---------- */
dialog{position:fixed;inset:0;margin:auto;width:min(860px,calc(100vw - 32px));max-height:calc(100vh - 48px);padding:0;border:0;border-radius:20px;background:var(--panel);color:var(--ink);box-shadow:0 40px 100px -20px rgba(0,0,0,.55);overflow:visible}
dialog::backdrop{background:rgba(14,13,12,.66)}
dialog[open]{display:block}
#detail-content{max-height:calc(100vh - 48px);overflow:auto;padding:46px 48px 38px;border-radius:20px}
.close-dialog{position:absolute;top:14px;right:14px;z-index:3;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--muted);font-size:17px;line-height:1;display:flex;align-items:center;justify-content:center}
.close-dialog:hover{border-color:var(--accent);color:var(--accent-ink)}
dialog h2{margin:8px 0 8px;padding-right:40px;font-size:31px;font-weight:650;line-height:1.3;letter-spacing:-.03em}
dialog h3{display:flex;align-items:center;gap:8px;margin:26px 0 9px;font-size:14.5px;font-weight:600}
dialog h3:before{content:"";width:3px;height:13px;border-radius:2px;background:var(--accent);flex:none}
dialog p{margin:0 0 12px;font-size:13px;line-height:1.9;color:#4E4740}
dialog .detail-metadata{margin:0 0 20px;padding-bottom:16px;border-bottom:1px solid var(--line);font-size:10.5px;line-height:1.7;letter-spacing:.02em;color:var(--muted-2)}
dialog .disclaimer{margin-top:20px!important;padding-top:14px;border-top:1px solid var(--line);font-size:10px!important;line-height:1.85!important;color:var(--muted-2)!important}
dialog .reason{margin:0 0 12px;padding:2px 0 2px 14px;border-left:2px solid var(--accent-soft)}
dialog .reason b{display:block;font-size:10px;letter-spacing:.08em;color:var(--accent-ink);font-weight:600}
dialog .reason p{margin:2px 0 0;font-size:12.5px}
dialog .source-list{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 4px}
dialog .source-link{padding:7px 10px;border:1px solid var(--line);border-radius:8px;font-size:10.5px;color:var(--accent-ink)}
dialog .source-link:hover{border-color:var(--accent);background:var(--accent-soft)}
.admission-detail{padding:16px 18px;margin:18px 0;border:1px solid var(--line);border-radius:12px;background:var(--paper-2)}
.admission-detail h3{margin:0 0 8px}
.admission-detail h3:before{display:none}
.admission-detail p{font-size:12px}
.admission-detail b{display:block;margin-top:10px;font-size:10px;letter-spacing:.08em;color:var(--muted-2);font-weight:600}
.admission-detail button{margin-top:8px}
.eligibility-note{padding:14px 16px;margin:16px 0;border-left:2px solid var(--accent);background:var(--accent-soft)}
.eligibility-note h3{margin:0 0 4px;font-size:12px}
.eligibility-note h3:before{display:none}
.eligibility-note p{margin:0;font-size:12px}
.full-record{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}
.full-record summary{padding:6px 0;font-size:10.5px;color:var(--muted);cursor:pointer}
.reading{font-size:12.5px;line-height:1.95;color:#4E4740}
.reading h2{margin:22px 0 8px;font-size:18px}
.reading h3{margin:18px 0 6px;font-size:14px;display:block;border:0;padding:0}
.reading h3:before{display:none}
.reading h4{margin:14px 0 4px;font-size:12px}
.reading p{margin:0 0 10px;font-size:12.5px}
.reading ul,.reading ol{margin:0 0 10px;padding-left:18px}
.reading li{margin:0 0 4px}
.reading a{color:var(--accent-ink);text-decoration:underline;text-underline-offset:2px}
.reading code{padding:1px 4px;border-radius:4px;background:var(--paper);font-size:11px}
.reading hr{margin:18px 0;border:0;border-top:1px solid var(--line)}
.reading table{width:100%;border-collapse:collapse;margin:10px 0;font-size:11px}
.reading th,.reading td{padding:7px 8px;border:1px solid var(--line);text-align:left;vertical-align:top}
.reading th{background:var(--paper);font-weight:600}
.reading .table-wrap{overflow:auto}
.translation-note{margin:0 0 14px!important;padding:10px 12px;border-left:2px solid var(--accent);background:var(--paper-2);font-size:11.5px!important;line-height:1.8!important;color:var(--muted)!important}
.original-language-note{display:none;font-size:11.5px!important;color:var(--muted)!important}
html[lang="ja"] .original-language-note{display:block}

/* ---------- keyword detail ---------- */
.keyword-group{margin:14px 0}
.keyword-group h4{margin:0 0 7px;font-size:11.5px;font-weight:600}
.keyword-group h4 small{margin-left:10px;font-size:9px;font-weight:400;color:var(--muted-2)}
.keyword-list{display:flex;flex-wrap:wrap;gap:5px}
.keyword-list span{padding:5px 8px;border-radius:7px;background:var(--paper);color:var(--muted);font-size:10.5px}
.keyword-aliases{font-size:10px!important;color:var(--muted-2)!important}
.keyword-evidence{padding:12px 0;border-top:1px solid var(--line);font-size:11px}
.keyword-evidence summary{cursor:pointer;color:var(--muted)}
.keyword-evidence a{color:var(--accent-ink)}
.keyword-evidence p{font-size:10.5px;line-height:1.8}

/* ---------- footer ---------- */
footer{margin-top:72px;padding:36px max(20px,calc((100vw - var(--max))/2 + var(--gutter))) 40px;background:var(--ink);color:#8F8778}
footer .brand{color:#fff;font-size:16px;font-weight:700;letter-spacing:-.03em}
footer p{max-width:760px;margin:12px 0 0;font-size:10px;line-height:1.95;color:#8F8778}

/* ---------- japanese ---------- */
html[lang="ja"]{--sans:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic","Noto Sans JP",sans-serif;--serif:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif}
html[lang="ja"] .main-nav a{font-size:12px;padding:8px 10px}
html[lang="ja"] .intro h1{letter-spacing:-.035em}
html[lang="ja"] .filter-trigger{font-size:11.5px;min-height:46px;line-height:1.4}
html[lang="ja"] .card h3{overflow-wrap:anywhere}
html[lang="ja"] .card-top{align-items:flex-start}
html[lang="ja"] .status{flex-shrink:0}

/* ---------- inner pages: keep the wordmark, give content the room ---------- */
.map-page .intro,.resources-page .intro,.guide-page .intro{padding:clamp(26px,4vw,42px) 0 clamp(16px,2.6vw,24px)}
.map-page .intro h1,.resources-page .intro h1,.guide-page .intro h1{font-size:clamp(46px,6.4vw,88px)}
.map-page .intro h1 em,.resources-page .intro h1 em,.guide-page .intro h1 em{font-size:.9em}
.map-page .intro p,.resources-page .intro p,.guide-page .intro p{font-size:13.5px}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .front-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .filter:nth-child(5n) .menu,.filter:nth-child(5n-1) .menu{left:0;right:auto}
  .filter:nth-child(3n) .menu{left:auto;right:0}
  .site-header{gap:16px}
  .header-link{display:none}
  .theme-toggle{margin-left:auto}
}
@media(max-width:900px){
  .results-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .site-header{display:grid;grid-template-columns:auto 1fr auto auto;grid-template-rows:auto auto;align-items:center;gap:8px;height:auto;padding:10px 16px 6px}
  .brand{grid-column:1;grid-row:1;margin:0}
  .theme-toggle{grid-column:2;grid-row:1;justify-self:end;margin:0}
  .bg-toggle{grid-column:3;grid-row:1;justify-self:end;margin:0}
  .site-header .language-switch{grid-column:4;grid-row:1;justify-self:end;margin:0}
  .theme-toggle button{font-size:0;gap:0;padding:5px 7px;min-height:24px}
  .theme-toggle i{width:10px;height:10px}
  .main-nav{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:repeat(4,1fr);gap:2px;width:100%;overflow:visible;padding:2px 0 0}
  .main-nav a{text-align:center;padding:8px 2px;font-size:11px}
  .main-nav a.selected{background:#ffffff10}
  .main-nav a.selected:after{left:28%;right:28%;bottom:4px}
  .intro{padding:34px 0 22px}
  .fi-date{white-space:normal;max-width:104px;line-height:1.35;overflow-wrap:anywhere}
  .intro h1{font-size:clamp(54px,17.5vw,92px)}
  .intro h1 em{font-size:.8em;letter-spacing:-.05em;margin:0 .03em 0 .05em}
  .intro-bottom{flex-direction:column;align-items:flex-start;gap:5px}
  .intro p{font-size:13.5px}
  .front-row{grid-template-columns:1fr;gap:14px}
  .front-row>.ad-slot{display:none}
  .ad-slot{min-height:200px}
  .ad-slot.is-empty,.ad-slot.ad-inline{min-height:120px}
  .search-section{padding:18px;border-radius:16px}
  .search-head{align-items:flex-start;flex-direction:column;gap:4px}
  .data-note{text-align:left}
  .filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filter:nth-child(3n) .menu{left:0;right:auto}
  .filter:nth-child(2n) .menu{left:auto;right:0}
  .filter-trigger{height:46px;font-size:11.5px}
  .results-grid{grid-template-columns:1fr}
  .skeleton-grid{grid-template-columns:1fr}
  .results-bar{flex-wrap:wrap}
  .results-bar>span{white-space:normal}
  .method-note{grid-template-columns:1fr;gap:8px}
  .guide-steps{grid-template-columns:1fr;gap:22px}
  .document-grid{grid-template-columns:1fr}
  .section-heading{flex-direction:column;align-items:flex-start;gap:6px}
  dialog{width:100%;max-height:100dvh;border-radius:0;margin:0;inset:0}
  #detail-content{max-height:100dvh;padding:56px 20px 32px}
  dialog h2{font-size:25px}
  footer{margin-top:52px;padding:28px 20px 32px}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .card:hover{transform:none}
}
