@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Sans+JP:wght@400;500;600;700&display=swap");

:root { color:#10283a; background:#e8fbff; font-family:"Helvetica Neue",Helvetica,"Noto Sans JP",Arial,sans-serif; font-synthesis:none; --ink:#10283a; --muted:#557181; --line:rgba(56,141,165,.24); --aqua:#9ceaf3; --aqua-2:#ccf8fb; --blue:#79bfe8; --pink:#ff9fc6; --paper:#effdff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; min-height:100vh; background:linear-gradient(145deg,#fbffff,#e8fbff 58%,#d7f5fb); }
body::before { content:""; position:fixed; inset:0; z-index:-1; background:linear-gradient(rgba(56,141,165,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(56,141,165,.075) 1px,transparent 1px); background-size:40px 40px; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; }
[hidden] { display:none !important; }
a:focus-visible,button:focus-visible { outline:3px solid var(--pink); outline-offset:4px; }

.site-shell { width:min(1512px,calc(100% - 56px)); margin:28px auto 60px; border:1px solid var(--line); background:rgba(248,255,255,.52); box-shadow:0 30px 90px rgba(32,106,124,.1); backdrop-filter:blur(5px); }
.site-header { position:sticky; top:0; z-index:20; height:76px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 34px; border-bottom:1px solid var(--line); background:rgba(244,255,255,.8); backdrop-filter:blur(18px); }
.brand { display:flex; align-items:center; gap:11px; font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.brand-dots { width:10px; height:10px; margin-right:14px; border-radius:50%; background:var(--pink); box-shadow:15px 0 0 #80dce9; }
.site-header nav { display:flex; gap:34px; }
.site-header nav a { position:relative; padding:10px 2px; font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.site-header nav a::after { content:""; position:absolute; left:0; right:100%; bottom:4px; height:1px; background:var(--ink); transition:right .25s ease; }
.site-header nav a:hover::after { right:0; }
.availability { justify-self:end; display:flex; align-items:center; gap:11px; color:var(--muted); font:500 10px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.availability i { width:8px; height:8px; border-radius:50%; background:#76dfc2; box-shadow:0 0 0 5px rgba(118,223,194,.18); }

.hero { min-height:615px; display:grid; grid-template-columns:53% 47%; border-bottom:1px solid var(--line); overflow:hidden; }
.hero-copy { position:relative; z-index:2; display:flex; flex-direction:column; padding:62px 52px 48px; }
.micro-label { margin:0; color:#3b7d94; font:500 11px "DM Mono",monospace; letter-spacing:.15em; text-transform:uppercase; }
.hero h1 { margin:27px 0 0; font-size:clamp(72px,8vw,128px); font-weight:500; letter-spacing:-.075em; line-height:.75; }
.hero h1 span,.hero h1 em { display:block; }
.hero h1 em { margin-left:13%; color:transparent; font-style:italic; font-weight:400; -webkit-text-stroke:1.7px #249abb; }
.hero-meta { display:flex; align-items:end; gap:64px; margin-top:auto; padding-top:38px; }
.hero-meta div span { display:block; margin-bottom:9px; color:var(--muted); font:500 10px "DM Mono",monospace; letter-spacing:.16em; text-transform:uppercase; }
.hero-meta div strong { font-size:13px; letter-spacing:.06em; text-transform:uppercase; }
.hero-meta>a { display:grid; width:58px; height:58px; margin-left:auto; place-items:center; border:1px solid #9dd2df; border-radius:50%; font-size:24px; transition:background .25s,transform .25s; }
.hero-meta>a:hover { background:rgba(156,234,243,.45); transform:translateY(4px); }

.dream-field { position:relative; min-width:0; border-left:1px solid var(--line); background:radial-gradient(circle at 75% 5%,rgba(255,159,198,.3),transparent 26%),linear-gradient(135deg,rgba(194,247,251,.4),rgba(122,213,235,.48)); }
.glass-frame { position:absolute; inset:38px 60px 72px 70px; overflow:hidden; border:1px solid rgba(111,192,214,.7); border-radius:18px; background:linear-gradient(145deg,rgba(255,255,255,.66),rgba(198,244,250,.2)); box-shadow:0 28px 55px rgba(58,146,166,.16),inset 0 0 40px rgba(255,255,255,.65); backdrop-filter:blur(16px); }
.portal { position:absolute; left:18%; top:7%; width:44%; height:76%; overflow:hidden; border:1px solid #76bdd0; border-radius:48% 48% 3px 3px; background:rgba(255,255,255,.7); box-shadow:15px 16px 0 rgba(255,255,255,.36); }
.portal span { position:absolute; inset:52% 0 0; background:linear-gradient(#a5edf4,#80d3e7); box-shadow:inset 0 24px 32px rgba(255,255,255,.38); }
.orb { position:absolute; display:block; border:1px solid rgba(255,255,255,.95); border-radius:50%; box-shadow:inset 10px 12px 24px rgba(255,255,255,.3),0 16px 28px rgba(78,160,179,.1); animation:float 5s ease-in-out infinite; }
.orb-a { right:11%; top:48%; width:178px; height:178px; background:rgba(145,238,243,.58); }
.orb-b { right:45%; top:61%; width:88px; height:88px; background:rgba(255,159,198,.43); animation-delay:-1.5s; }
.orb-c { right:7%; top:4%; width:74px; height:74px; background:rgba(255,255,255,.52); animation-delay:-2.8s; }
.ring { position:absolute; right:-10%; bottom:-31%; width:390px; height:390px; border:1px solid rgba(255,255,255,.8); border-radius:50%; }
.field-code { position:absolute; right:24px; top:65px; color:#275c73; font:500 10px "DM Mono",monospace; letter-spacing:.15em; line-height:2; text-transform:uppercase; writing-mode:vertical-rl; }

.works-section { background:rgba(247,254,255,.64); }
.section-head { min-height:162px; display:flex; align-items:end; justify-content:space-between; gap:30px; padding:36px 40px 31px; border-bottom:1px solid var(--line); }
.section-head h2,.profile-intro h2,.contact-section h2 { margin:11px 0 0; font-size:clamp(38px,4.5vw,66px); font-weight:500; letter-spacing:-.055em; line-height:1; }
.section-head h2 sup { margin-left:11px; color:#4599b2; font:500 12px "DM Mono",monospace; letter-spacing:.06em; vertical-align:middle; }
.filters { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; }
.filters button { min-width:108px; padding:12px 18px; border:1px solid #b4d8e2; border-radius:99px; background:rgba(255,255,255,.54); font:500 10px "DM Mono",monospace; letter-spacing:.13em; text-transform:uppercase; cursor:pointer; transition:background .2s,color .2s,border-color .2s; }
.filters button:hover { border-color:#4caac1; }
.filters button.active { border-color:var(--ink); background:var(--ink); color:white; }
.work-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.work-card { min-width:0; padding:24px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .25s; }
.work-card:nth-child(4n) { border-right:0; }
.work-card:hover { background:rgba(180,240,247,.22); }
.work-image { position:relative; aspect-ratio:1.2/1; overflow:hidden; background:#c5eef4; }
.work-image::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.4); pointer-events:none; }
.work-image img { width:100%; height:100%; object-fit:cover; transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .4s; }
.work-image span { position:absolute; right:12px; bottom:12px; z-index:2; padding:9px 12px; border-radius:99px; background:rgba(241,253,255,.86); font:500 9px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; opacity:0; transform:translateY(6px); transition:opacity .25s,transform .25s; backdrop-filter:blur(8px); }
.work-card:hover img { transform:scale(1.045); filter:saturate(1.06); }
.work-card:hover .work-image span { opacity:1; transform:none; }
.work-info { display:grid; grid-template-columns:32px 1fr; margin-top:18px; }
.work-info>span { padding-top:4px; color:#4589a0; font:500 10px "DM Mono",monospace; }
.work-info h3 { min-height:2.7em; margin:0; font-size:16px; font-weight:600; line-height:1.4; }
.work-info p { grid-column:2; margin:6px 0 0; color:var(--muted); font:400 9px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }

.profile-section { display:grid; grid-template-columns:43% 57%; min-height:520px; border-bottom:1px solid var(--line); background:rgba(247,254,255,.7); }
.profile-intro { position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:center; padding:48px clamp(35px,5vw,75px); border-right:1px solid var(--line); background:radial-gradient(circle at 85% 14%,rgba(255,159,198,.25),transparent 20%),linear-gradient(145deg,rgba(204,248,251,.78),rgba(239,253,255,.82)); }
.profile-intro::after { content:""; position:absolute; right:-110px; bottom:-160px; width:390px; height:390px; border:1px solid rgba(80,172,195,.38); border-radius:50%; box-shadow:-55px -30px 0 rgba(255,255,255,.22); pointer-events:none; }
.profile-intro h2 { position:relative; z-index:1; margin-top:28px; font-size:clamp(52px,5.6vw,82px); line-height:.78; }
.profile-intro h2 span,.profile-intro h2 em { display:block; }
.profile-intro h2 em { margin-left:9%; color:transparent; font-style:italic; font-weight:400; -webkit-text-stroke:1.4px #249abb; }
.profile-name { position:relative; z-index:1; margin:40px 0 0; font-size:17px; font-weight:600; letter-spacing:.08em; }
.profile-name span { margin-left:10px; color:var(--muted); font:400 10px "DM Mono",monospace; letter-spacing:.08em; }
.profile-course { position:relative; z-index:1; margin:15px 0 0; color:#456276; font-size:12px; line-height:1.75; }
.profile-intro ul { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:8px; margin:24px 0 0; padding:0; list-style:none; }
.profile-intro li { padding:9px 13px; border:1px solid #9bcfdc; border-radius:99px; background:rgba(255,255,255,.3); font:500 9px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.profile-history { display:flex; flex-direction:column; justify-content:center; padding:38px clamp(35px,5vw,80px); }
.history-header { display:flex; justify-content:space-between; gap:30px; padding-bottom:14px; color:#3b7d94; font:500 10px "DM Mono",monospace; letter-spacing:.14em; text-transform:uppercase; }
.profile-history ol { margin:0; padding:0; border-bottom:1px solid var(--line); list-style:none; }
.profile-history li { position:relative; display:grid; grid-template-columns:108px 1fr; gap:22px; align-items:center; min-height:104px; border-top:1px solid var(--line); }
.profile-history time { color:#35859e; font:500 12px "DM Mono",monospace; letter-spacing:.08em; }
.profile-history p { margin:0; font-size:15px; font-weight:600; line-height:1.55; }
.profile-history p span { color:#597585; font-size:12px; font-weight:400; }
.profile-history li.current::after { content:"CURRENT"; position:absolute; right:0; top:18px; padding:5px 8px; border-radius:99px; background:#dff9ef; color:#377f68; font:500 8px "DM Mono",monospace; letter-spacing:.1em; }

.contact-section { padding:72px 6vw 88px; background:linear-gradient(125deg,rgba(200,247,251,.72),rgba(245,253,255,.82) 55%,rgba(255,206,228,.28)); }
.contact-layout { display:grid; grid-template-columns:25% 75%; align-items:end; gap:40px; margin-top:48px; }
.contact-section h2 { margin:0; font-size:clamp(52px,6vw,90px); }
.email-link { min-width:0; display:grid; grid-template-columns:max-content 1fr 64px; align-items:center; gap:0; padding:12px 0 20px; border-bottom:1px solid var(--ink); font-size:clamp(24px,3.35vw,50px); font-weight:500; letter-spacing:-.045em; line-height:1; }
.email-domain { color:#3997b0; font-weight:400; }
.email-link i { display:grid; width:54px; height:54px; justify-self:end; place-items:center; border-radius:50%; background:var(--ink); color:white; font-size:17px; font-style:normal; transition:transform .25s,background .25s; }
.email-link:hover i { background:#238eaa; transform:translate(3px,-3px); }
footer { min-height:74px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 34px; color:var(--muted); font:400 9px "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; }
footer a { justify-self:end; }

.pill-link { display:inline-flex; align-items:center; justify-content:center; width:max-content; min-height:44px; padding:0 20px; border:1px solid #9bcfdc; border-radius:99px; background:rgba(255,255,255,.48); font:500 10px "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; transition:background .2s,border-color .2s; }
.pill-link:hover { border-color:#3c9db6; background:rgba(156,234,243,.35); }
.standalone { min-height:100vh; display:grid; align-content:center; justify-items:center; gap:24px; padding:30px; text-align:center; }
.standalone h1 { margin:0; font-size:clamp(36px,6vw,72px); letter-spacing:-.05em; }

.detail-shell { background:rgba(248,255,255,.72); }
.project-detail { min-height:70vh; }
.detail-title { display:flex; align-items:end; justify-content:space-between; gap:30px; padding:72px clamp(28px,6vw,90px) 46px; border-bottom:1px solid var(--line); }
.detail-title h1 { max-width:1000px; margin:18px 0 0; font-size:clamp(48px,7vw,104px); font-weight:500; letter-spacing:-.065em; line-height:.95; }
.detail-visual { margin:clamp(24px,4vw,60px); aspect-ratio:16/9; overflow:hidden; background:linear-gradient(135deg,#d9f7fb,#f8fdff); }
.detail-visual img { width:100%; height:100%; object-fit:cover; }
.detail-body { display:grid; grid-template-columns:minmax(230px,28%) 1fr; gap:clamp(40px,7vw,110px); padding:25px clamp(28px,6vw,90px) 100px; }
.detail-body aside { display:flex; flex-direction:column; gap:28px; }
.detail-body aside div { padding-bottom:22px; border-bottom:1px solid var(--line); }
.detail-body aside span { display:block; margin-bottom:9px; color:#3b7d94; font:500 9px "DM Mono",monospace; letter-spacing:.13em; text-transform:uppercase; }
.detail-body aside strong { display:block; font-size:13px; font-weight:600; line-height:1.7; }
.detail-text { min-width:0; }
.detail-copy { padding:0 0 46px; }
.detail-copy + .detail-copy { padding-top:42px; border-top:1px solid var(--line); }
.detail-copy>p:last-child { max-width:760px; margin:20px 0 0; white-space:pre-wrap; font-size:15px; line-height:2.05; }
.detail-empty { margin:0; color:var(--muted); font-size:13px; }

.admin-page { min-height:100vh; background:linear-gradient(145deg,#f9ffff,#e7fbff 56%,#d8f4fa); }
.admin-header { position:sticky; top:0; z-index:30; min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 clamp(20px,4vw,56px); border-bottom:1px solid var(--line); background:rgba(244,255,255,.9); backdrop-filter:blur(18px); }
.admin-header>div { display:flex; align-items:center; gap:24px; color:var(--muted); font:500 9px "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; }
.admin-header>div a { padding:10px 15px; border:1px solid #a8d2dc; border-radius:99px; color:var(--ink); }
.admin-gate { width:min(680px,calc(100% - 40px)); margin:12vh auto; padding:clamp(38px,7vw,78px); border:1px solid var(--line); background:rgba(255,255,255,.58); box-shadow:0 30px 80px rgba(48,132,151,.12); }
.admin-gate h1 { margin:20px 0 26px; font-size:clamp(42px,7vw,76px); font-weight:500; letter-spacing:-.06em; }
.admin-gate>p:not(.micro-label) { margin:0 0 28px; color:var(--muted); line-height:1.9; }
.admin-unlock { display:flex; align-items:end; gap:12px; }
.admin-unlock label { flex:1; display:flex; flex-direction:column; gap:9px; }
.admin-unlock label span { color:#3b7d94; font:500 9px "DM Mono",monospace; letter-spacing:.12em; text-transform:uppercase; }
.admin-unlock input { width:100%; min-height:54px; padding:0 15px; border:1px solid #afd6df; background:rgba(255,255,255,.68); color:var(--ink); font:inherit; }
.account-login { display:flex; align-items:center; gap:13px; margin-top:24px; color:var(--muted); font:500 9px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.account-login a { padding-bottom:3px; border-bottom:1px solid currentColor; color:var(--ink); }
.admin-layout { width:min(1540px,100%); margin:0 auto; display:grid; grid-template-columns:minmax(0,57%) minmax(340px,43%); }
.admin-form-panel { min-width:0; padding:clamp(34px,5vw,74px); border-right:1px solid var(--line); }
.admin-title { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:48px; }
.admin-title h1 { margin:14px 0 0; font-size:clamp(42px,5vw,72px); font-weight:500; letter-spacing:-.055em; }
.text-button { padding:0 0 5px; border:0; border-bottom:1px solid currentColor; background:none; font:500 10px "DM Mono",monospace; cursor:pointer; }
.work-form { display:flex; flex-direction:column; gap:28px; }
.work-form label { min-width:0; display:flex; flex-direction:column; gap:10px; }
.work-form label>span { color:#3b7d94; font:500 10px "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; }
.work-form input,.work-form select,.work-form textarea { width:100%; border:1px solid #afd6df; border-radius:0; background:rgba(255,255,255,.62); color:var(--ink); font:inherit; font-size:14px; outline:none; transition:border-color .2s,box-shadow .2s; }
.work-form input,.work-form select { min-height:50px; padding:0 15px; }
.work-form textarea { resize:vertical; padding:15px; line-height:1.8; }
.work-form input:focus,.work-form select:focus,.work-form textarea:focus { border-color:#3198b2; box-shadow:0 0 0 3px rgba(93,203,222,.16); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.check-label { align-self:end; min-height:50px; flex-direction:row!important; align-items:center; padding:0 15px; border:1px solid #afd6df; background:rgba(255,255,255,.44); cursor:pointer; }
.check-label input { width:18px; min-height:0; height:18px; padding:0; accent-color:#258fa9; }
.check-label span { color:var(--ink)!important; }
.image-input { position:relative; min-height:120px; display:grid; grid-template-columns:116px 1fr; align-items:center; gap:18px; padding:14px; border:1px dashed #8fc8d5; background:rgba(255,255,255,.35); }
.image-input img { grid-row:1/3; width:116px; height:90px; object-fit:cover; background:#d9f6fa; }
.image-input input { min-height:0; padding:0; border:0; background:none; }
.image-input small { color:var(--muted); font-size:10px; }
.primary-button { width:max-content; min-width:190px; min-height:54px; padding:0 26px; border:0; border-radius:99px; background:var(--ink); color:#fff; font:500 11px "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; transition:transform .2s,background .2s; }
.primary-button:hover { background:#227f99; transform:translateY(-2px); }
.primary-button:disabled { opacity:.5; cursor:wait; transform:none; }
.login-button { display:inline-flex; align-items:center; justify-content:center; }
.form-message { margin:0; padding:14px 17px; border-left:3px solid #58bfa6; background:rgba(191,244,229,.32); font-size:12px; line-height:1.6; }
.form-message.error { border-color:#e87b9e; background:rgba(255,202,219,.28); }
.admin-list-panel { min-width:0; padding:clamp(34px,4vw,60px); background:rgba(247,254,255,.52); }
.admin-list-head { display:flex; align-items:center; justify-content:space-between; padding-bottom:20px; border-bottom:1px solid var(--line); }
.admin-list-head strong { color:#3190aa; font:500 22px "DM Mono",monospace; }
.admin-work-list article { display:grid; grid-template-columns:92px 1fr auto; gap:17px; align-items:center; padding:18px 0; border-bottom:1px solid var(--line); }
.admin-work-list article>img { width:92px; height:72px; object-fit:cover; background:#d9f6fa; }
.admin-work-list article>div { min-width:0; }
.admin-work-list article span,.admin-work-list article p { color:var(--muted); font:500 8px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.admin-work-list article h2 { margin:7px 0; overflow-wrap:anywhere; font-size:13px; line-height:1.4; }
.admin-work-list article p { margin:0; color:#348e76; }
.admin-actions { display:flex; flex-direction:column; gap:7px; }
.admin-actions button { min-width:54px; padding:7px 9px; border:1px solid #a9d0d9; background:rgba(255,255,255,.55); font:500 9px "DM Mono",monospace; cursor:pointer; }
.admin-actions button.danger { border-color:#e9b1c3; color:#a74767; }

@keyframes float { 50% { transform:translateY(-14px) translateX(5px); } }

@media (max-width:1050px) {
  .site-header { grid-template-columns:1fr auto; } .availability { display:none; }
  .hero { grid-template-columns:1fr; } .hero-copy { min-height:590px; }
  .dream-field { min-height:560px; border-left:0; border-top:1px solid var(--line); }
  .work-grid { grid-template-columns:repeat(2,1fr); } .work-card:nth-child(4n) { border-right:1px solid var(--line); } .work-card:nth-child(2n) { border-right:0; }
  .profile-section { grid-template-columns:1fr; } .profile-intro { min-height:440px; border-right:0; border-bottom:1px solid var(--line); }
  .contact-layout { grid-template-columns:1fr; }
  .admin-layout { grid-template-columns:1fr; } .admin-form-panel { border-right:0; border-bottom:1px solid var(--line); }
}

@media (max-width:700px) {
  .site-shell { width:calc(100% - 20px); margin:10px auto 30px; }
  .site-header { height:66px; padding:0 17px; } .brand { font-size:10px; } .site-header nav { gap:14px; } .site-header nav a { font-size:9px; letter-spacing:.08em; }
  .hero-copy { min-height:570px; padding:48px 24px 34px; } .hero h1 { font-size:clamp(64px,21vw,100px); } .hero h1 em { margin-left:5%; }
  .hero-meta { gap:24px; } .hero-meta div:nth-child(2) { display:none; }
  .dream-field { min-height:460px; } .glass-frame { inset:25px 42px 52px 24px; } .field-code { right:13px; top:40px; } .orb-a { width:135px; height:135px; }
  .section-head { display:block; padding:32px 20px 24px; } .filters { justify-content:flex-start; margin-top:28px; } .filters button { min-width:0; padding:10px 13px; }
  .work-grid { grid-template-columns:1fr; } .work-card,.work-card:nth-child(2n),.work-card:nth-child(4n) { padding:17px; border-right:0; } .work-info h3 { min-height:auto; }
  .profile-intro { min-height:410px; padding:42px 23px 48px; } .profile-intro h2 { font-size:58px; } .profile-name { margin-top:36px; }
  .profile-history { padding:34px 23px 42px; } .profile-history li { grid-template-columns:76px 1fr; gap:14px; min-height:124px; } .profile-history p { font-size:14px; } .profile-history li.current::after { top:8px; }
  .contact-section { padding:60px 24px 72px; } .contact-layout { display:block; margin-top:38px; } .contact-section h2 { font-size:52px; }
  .email-link { grid-template-columns:1fr 54px; margin-top:34px; font-size:clamp(25px,8vw,38px); line-height:1.15; } .email-local,.email-domain { grid-column:1; } .email-domain { display:block; } .email-link i { grid-column:2; grid-row:1/3; width:48px; height:48px; }
  footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; padding:22px 17px; } footer span:nth-child(2) { display:none; }
  .detail-title { display:block; padding:48px 22px 30px; } .detail-title .pill-link { margin-top:28px; }
  .detail-visual { margin:18px; aspect-ratio:4/3; }
  .detail-body { grid-template-columns:1fr; gap:52px; padding:25px 22px 70px; }
  .admin-header>div>span { display:none; }
  .admin-unlock { align-items:stretch; flex-direction:column; }
  .admin-layout { display:block; } .admin-form-panel,.admin-list-panel { padding:36px 20px; }
  .admin-title { display:block; } .admin-title .text-button { margin-top:20px; }
  .form-row { grid-template-columns:1fr; }
  .image-input { grid-template-columns:86px 1fr; } .image-input img { width:86px; height:70px; }
  .admin-work-list article { grid-template-columns:74px 1fr; } .admin-work-list article>img { width:74px; height:60px; } .admin-actions { grid-column:2; flex-direction:row; }
}

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