/* 編集画面・管理画面 */
:root{--paper:#FAF9F6;--sheet:#fff;--ink:#2B2D2F;--ink-soft:#63676B;--rule:#E2DFD8;--pop:#6B9A72;--pop-deep:#557D5B;--warn:#B5643C;--danger:#B23B3B}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif;font-size:15px;line-height:1.75;letter-spacing:.02em}
a{color:var(--pop-deep)}
img{max-width:100%}
[hidden]{display:none!important}
.app-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;padding:12px 20px;background:#fff;border-bottom:1px solid var(--rule)}
.app-brand{margin:0;font-weight:700;letter-spacing:.06em;font-size:.9375rem}
.app-nav{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;font-size:.875rem}
.app-nav a{text-decoration:none;color:var(--ink)}
.app-nav form{margin:0}
.app-nav button{padding:0;border:0;background:none;font:inherit;color:var(--ink-soft);cursor:pointer;text-decoration:underline}
.app-main{max-width:860px;margin:0 auto;padding:24px 16px 120px}
.app-foot{padding:20px;text-align:center;font-size:.75rem;color:var(--ink-soft)}
.panel{margin:0 0 18px;padding:24px 22px;background:var(--sheet);border-radius:14px;box-shadow:0 1px 0 var(--rule)}
.panel.narrow{max-width:460px;margin:24px auto}
.h1{margin:0 0 14px;font-size:1.375rem;letter-spacing:.06em}
.h2{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:1.0625rem;letter-spacing:.06em}
.h2 .no{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--pop);color:#fff;font-size:.8125rem}
.mt{margin-top:20px}
.note,.hint{color:var(--ink-soft);font-size:.8125rem}
.hint{display:block;margin:2px 0 10px}
.alert{margin:0 0 16px;padding:12px 14px;border-radius:10px;background:#FBEDE8;color:#8A3B22;font-size:.875rem}
.alert p{margin:0}.alert ul{margin:6px 0 0;padding-left:1.2em}
.ok{margin:0 0 16px;padding:12px 14px;border-radius:10px;background:#E8F0E6;color:#2F5A37;font-size:.875rem}
.form{display:grid;gap:14px}
.f{display:grid;gap:4px;margin:0 0 14px;padding:0;border:0;min-width:0}
.f>span,.f>legend{font-size:.8125rem;font-weight:700;color:var(--ink-soft);padding:0}
.form .f{margin:0}
input[type=text],input[type=email],input[type=url],input[type=tel],input[type=password],textarea{width:100%;padding:11px 12px;border:1.5px solid var(--rule);border-radius:10px;background:#fff;font:inherit;font-size:16px;color:inherit}
input:focus,textarea:focus{outline:none;border-color:var(--pop)}
textarea{resize:vertical;line-height:1.8}
.check{display:flex;align-items:flex-start;gap:8px;margin:0 0 14px;font-size:.875rem;cursor:pointer}
.check input{margin-top:6px}
.check.small{margin:0;font-size:.8125rem}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;border:0;border-radius:999px;background:var(--pop);color:#fff;font:inherit;font-weight:700;letter-spacing:.06em;text-decoration:none;cursor:pointer}
.btn:disabled{opacity:.6}
.btn.small{min-height:36px;padding:0 14px;font-size:.8125rem}
.btn.ghost{background:transparent;color:var(--pop-deep);box-shadow:inset 0 0 0 1.5px var(--pop)}
.btn.ghost.warn{color:var(--warn);box-shadow:inset 0 0 0 1.5px var(--warn)}
.btn.danger{background:var(--danger)}
.btn.file{position:relative;overflow:hidden}
.btn.file input{position:absolute;inset:0;opacity:0;cursor:pointer}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px;align-items:end}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.form.grid3{gap:14px}
@media (max-width:640px){.grid2,.grid3{grid-template-columns:1fr}.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0 0 18px;font-size:.875rem}
.kv dt{color:var(--ink-soft)}.kv dd{margin:0;word-break:break-all}

/* 編集画面 */
.status{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.status p{margin:0}
.status-url{font-size:.875rem;word-break:break-all}
.status-sub{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:.8125rem}
.switch{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:700}
.switch input{position:absolute;opacity:0}
.sw{position:relative;width:52px;height:30px;border-radius:999px;background:#CFCBC2;transition:background .2s}
.sw::after{content:"";position:absolute;left:3px;top:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s}
.switch input:checked+.sw{background:var(--pop)}
.switch input:checked+.sw::after{transform:translateX(22px)}
.switch input:focus-visible+.sw{outline:2px solid var(--pop);outline-offset:2px}
.cardprev{max-width:360px;margin:0 auto 20px}
.cp-card{position:relative;aspect-ratio:671/412;container-type:inline-size;background:var(--pv-card);color:var(--pv-on);border-radius:12px;box-shadow:0 10px 24px rgba(40,52,42,.18);overflow:hidden}
.cardprev.is-light .cp-card{box-shadow:inset 0 0 0 1px var(--rule),0 10px 24px rgba(40,52,42,.12)}
.cp-logo{position:absolute;left:50%;top:12%;max-width:44cqw;max-height:36%;transform:translateX(-50%);object-fit:contain}
.cp-logo.is-mono{filter:brightness(0) invert(1)}
.cardprev.is-darkon .cp-logo.is-mono{filter:brightness(0)}
.cp-name{position:absolute;left:0;right:0;top:55%;margin:0;text-align:center;font-size:5.6cqw;font-weight:300;letter-spacing:.3em;text-indent:.3em;line-height:1.2;white-space:nowrap}
.cp-sub{position:absolute;left:0;right:0;top:68%;margin:0;text-align:center;font-size:2.2cqw;letter-spacing:.3em;text-indent:.3em}
.cardprev .hint{text-align:center;margin-top:8px}
.swatches{display:flex;flex-wrap:wrap;gap:10px 6px}
.swatch small{font-size:.625rem;letter-spacing:0;white-space:nowrap}
.swatch{display:grid;justify-items:center;gap:2px;width:68px;cursor:pointer;font-size:.6875rem;color:var(--ink-soft);text-align:center;line-height:1.3}
.swatch input[type=radio]{position:absolute;opacity:0}
.swatch>span{display:block;width:44px;height:28px;border-radius:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.swatch input:checked+span,.swatch.custom input[type=radio]:checked~input[type=color]{outline:3px solid var(--pop);outline-offset:2px}
.swatch input[type=color]{width:44px;height:28px;padding:0;border:0;border-radius:6px;background:none;cursor:pointer}
.imgf{margin:0 0 14px}
.imgf-l{display:block;margin-bottom:6px;font-size:.8125rem;font-weight:700;color:var(--ink-soft)}
.imgf-row{display:flex;gap:12px;align-items:center}
.imgf-thumb{flex:none;display:grid;place-items:center;width:84px;height:84px;border-radius:10px;background:#F1EEE8;overflow:hidden;font-size:.75rem;color:var(--ink-soft)}
.imgf-thumb img{width:100%;height:100%;object-fit:cover}
.imgf-thumb.is-logo{background:repeating-conic-gradient(#E9E5DD 0 25%,#F6F4EF 0 50%) 0 0/14px 14px}
.imgf-thumb.is-logo img{object-fit:contain;padding:6px}
.imgf-ctl{display:grid;gap:6px;justify-items:start}
.imgf-ctl .hint{margin:0}
.btnf{margin:0 0 10px;border:1.5px solid var(--rule);border-radius:12px;background:#fff}
.btnf[open]{border-color:#CFE0CC}
.btnf summary{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;list-style:none}
.btnf summary::-webkit-details-marker{display:none}
.btnf summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid var(--ink-soft);border-bottom:2px solid var(--ink-soft);transform:rotate(45deg);transition:transform .2s}
.btnf[open] summary::after{transform:rotate(225deg)}
.btnf summary .no{flex:none;padding:2px 10px;border-radius:999px;background:var(--pop);color:#fff;font-size:.75rem;font-weight:700}
.btnf.is-off summary .no{background:#B9B5AC}
.btnf-sum{font-size:.875rem;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.btnf-body{padding:4px 16px 16px}
.types{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.type input{position:absolute;opacity:0}
.type span{display:inline-block;padding:7px 14px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--rule);font-size:.8125rem;cursor:pointer}
.type input:checked+span{background:var(--pop);color:#fff;box-shadow:none;font-weight:700}
.type input:focus-visible+span{outline:2px solid var(--pop);outline-offset:2px}
.savebar{position:fixed;left:0;right:0;bottom:0;z-index:10;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(250,249,246,.94);border-top:1px solid var(--rule);text-align:center;backdrop-filter:blur(6px)}
.savebar .btn{min-width:min(100%,320px)}

/* 管理画面 */
.linkbox{display:flex;gap:8px;margin:0 0 18px}
.linkbox input{flex:1}
.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse;font-size:.8125rem}
.table th,.table td{padding:10px 8px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.table th{font-size:.75rem;color:var(--ink-soft);white-space:nowrap}
.ops{display:flex;flex-wrap:wrap;gap:6px;min-width:220px}
.ops form{margin:0}
.del summary{font-size:.75rem;color:var(--danger);cursor:pointer;padding:8px 4px}
.del form{display:grid;gap:6px;margin-top:6px}
.tag{display:inline-block;padding:0 8px;border-radius:999px;background:#E8F0E6;color:var(--pop-deep)}
.terms h2{margin-top:24px}
.terms li,.terms p{font-size:.875rem}
/* プロフィールの表示見本（番号つき） */
.mk{display:inline-grid;place-items:center;flex:none;width:18px;height:18px;margin:0 6px 0 0;border-radius:50%;background:#C46A3E;color:#fff;font-style:normal;font-size:.6875rem;font-weight:700;line-height:1;letter-spacing:0;vertical-align:2px;text-indent:0}
.pfd{margin:0 0 20px;border:1.5px solid var(--rule);border-radius:12px;background:#FCFBF8}
.pfd summary{padding:10px 14px;font-size:.8125rem;font-weight:700;color:var(--ink-soft);cursor:pointer}
.pfd-body{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:18px 24px;align-items:center;padding:4px 16px 0}
.pfd-note{margin:12px 16px 14px}
.pfd-phone{padding:16px 16px 0;background:#FAF9F6;border:1px solid var(--rule);border-radius:18px 18px 0 0;border-bottom:0;font-size:12px;line-height:1.6;color:var(--ink);user-select:none}
.pfd-phone p{margin:0}
.pfd-phone .mk{margin:0 0 0 4px;width:16px;height:16px;font-size:.625rem;vertical-align:1px}
.pfd-cap{text-align:center;font-size:10px;color:#9A9690;letter-spacing:.08em}
.pfd-who{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;margin-top:12px}
.pfd-photo{position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#E4E0D8;color:#BDB7AC;border:2px solid #fff;box-shadow:0 3px 8px rgba(60,52,44,.12)}
.pfd-photo svg{width:30px;height:30px}
.pfd-photo .mk{position:absolute;right:-6px;top:-4px;margin:0}
.pfd-name{font-size:15px;font-weight:500;letter-spacing:.12em;line-height:1.35}
.pfd-name small{margin-left:.5em;font-size:10px;font-weight:400;color:var(--ink-soft)}
.pfd-role{margin-top:3px!important;font-size:10px;color:var(--ink-soft);line-height:1.6}
.pfd-role b{color:var(--pop-deep)}
.pfd-copy{margin-top:14px!important;text-align:center;font-size:13px;font-weight:700;color:var(--pop-deep)}
.pfd-copy span{text-decoration:underline wavy #B9D0BC;text-decoration-thickness:1.2px;text-underline-offset:5px}
.pfd-lead{margin-top:8px!important;text-align:center;font-size:10px;line-height:1.9;color:var(--ink-soft)}
.pfd-tags{display:flex;align-items:center;justify-content:center;margin-top:10px}
.pfd-tags ul{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;margin:0;padding:0;list-style:none}
.pfd-tags li{padding:1px 9px;border-radius:999px;background:#E8F0E6;color:var(--pop-deep);font-size:9.5px;font-weight:700}
.pfd-more{margin:14px -16px 0;padding:10px 12px;border-top:1px dashed var(--rule);text-align:center;font-size:9.5px;color:#9A9690;background:linear-gradient(#FAF9F6,#F1EEE8)}
.pfd-list{margin:0;padding:0;list-style:none;display:grid;gap:6px;font-size:.8125rem}
.pfd-list li{display:flex;align-items:center}
.f>span .mk,.f>legend .mk,.imgf-l .mk{vertical-align:1px}
@media (max-width:640px){.pfd-body{grid-template-columns:1fr;justify-items:center}.pfd-phone{width:100%;max-width:320px}.pfd-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;width:100%;max-width:320px;font-size:.75rem}}
.grid2{align-items:start}
@media (max-width:640px){.pfd-list{gap:4px 8px;font-size:11.5px;letter-spacing:0}.pfd-list li{white-space:nowrap}.pfd-list .mk{margin-right:4px}}
/* 6つのボタンの表示見本 */
.bpd-body{display:grid;grid-template-columns:repeat(2,minmax(0,250px));justify-content:center;gap:14px;padding:4px 16px 0}
.bpd-phone{display:flex;flex-direction:column;padding:14px 12px 0}
.bpd-phone .pfd-more{margin:auto -12px 0;margin-top:auto}
.bpd-menu{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.bpd-menu li{display:flex;align-items:center;justify-content:space-between;gap:2px;min-height:34px;padding:4px 6px 4px 8px;background:#fff;border-radius:7px;font-size:9.5px;font-weight:700;line-height:1.35;box-shadow:0 1px 0 var(--rule)}
.bpd-menu li.is-on{box-shadow:0 0 0 1.5px #C46A3E}
.bpd-menu li svg{flex:none;width:10px;height:10px;color:var(--pop)}
.bpd-menu .mk{margin:0}
.bpd-tap{margin:12px 0 0!important;text-align:right;font-size:10px;font-weight:700;color:#C46A3E}
.bpd-note{margin:6px 0 14px!important;font-size:9.5px;color:var(--ink-soft)}
.bpd-back{font-size:9.5px;color:var(--ink-soft);margin-top:8px!important}
.bpd-lb{margin-top:8px!important;text-align:center;font-size:9px;font-weight:700;color:var(--pop);letter-spacing:.14em}
.bpd-h{margin-top:2px!important;text-align:center;font-size:12.5px;font-weight:700;color:var(--pop-deep);letter-spacing:.04em}
.bpd-img{position:relative;display:grid;place-items:center;height:54px;margin-top:9px;border-radius:7px;background:#E4E0D8;color:#C9C3B8}
.bpd-img svg{width:24px;height:24px}
.bpd-img .mk,.bpd-text .mk{position:absolute;right:-5px;top:-5px;margin:0}
.bpd-text{position:relative;display:grid;gap:5px;margin-top:9px;padding:10px 9px;background:#fff;border-radius:7px}
.bpd-text span{display:block;height:4px;border-radius:2px;background:#E2DFD8}
.bpd-text span.s{width:60%}
.bpd-phone .pfd-more{margin-top:12px}
.bpd-list{grid-template-columns:repeat(5,auto);justify-content:center;gap:6px 16px;margin:14px 16px 0}
@media (max-width:640px){.bpd-body{gap:8px;padding:4px 10px 0}.bpd-phone{padding:12px 8px 0}.bpd-phone .pfd-more{margin-left:-8px;margin-right:-8px}.bpd-list{grid-template-columns:repeat(2,minmax(0,1fr));justify-content:stretch;max-width:none;width:auto}}
@media (max-width:640px){.bpd-menu li{padding:4px 5px 4px 6px;font-size:9px}.bpd-menu li svg{width:9px;height:9px}}
.bpd-menu li{position:relative}.bpd-menu li .mk{position:absolute;right:-5px;top:-6px}