*{box-sizing:border-box}
body{margin:0;font-family:'Hiragino Sans','Yu Gothic',sans-serif;background:#eef1f5;color:#222;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"palt"}
a{color:#1f6feb;text-decoration:none}
img{max-width:100%}

/* topbar */
.topbar{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(180deg,#222b3a 0%,#1b2330 100%);color:#fff;padding:12px 16px;position:sticky;top:0;z-index:10;box-shadow:0 1px 0 rgba(0,0,0,.3),0 6px 18px rgba(15,20,30,.18)}
.topbar .brand{color:#fff;font-weight:700;letter-spacing:.04em}
.topbar nav a{color:#cdd6e2;margin-left:14px;font-size:14px;transition:color .15s ease}
.topbar nav a:hover{color:#fff}
.edit-title{padding:14px 16px 4px;font-weight:700;font-size:18px;letter-spacing:.02em}
.edit-title .slug{color:#8a94a6;font-size:13px;font-weight:400}
.tabbar{display:flex;gap:6px;overflow-x:auto;padding:8px 20px;background:#fff;position:sticky;top:46px;z-index:9;border-bottom:1px solid #e3e8ef;justify-content:center}
.tabbar a{flex:0 0 auto;padding:9px 14px;border-radius:9px;color:#5b6577;font-size:14px;white-space:nowrap;font-weight:600;transition:background .15s ease,color .15s ease}
.tabbar a:hover{background:#f5f8fc;color:#33415c}
.tabbar a.on{background:#1f6feb;color:#fff;box-shadow:0 4px 12px rgba(31,111,235,.28)}
.tabbar a.on:hover{background:#1f6feb;color:#fff}

.wrap{max-width:1140px;margin:0 auto;padding:24px 24px}
@media(min-width:900px){.wrap{padding:28px 32px}}
.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:8px}
.page-head h1{font-size:20px;margin:0;letter-spacing:.02em}
.flash{background:#e6f7ec;border:1px solid #b7e2c6;color:#1c7a3f;padding:11px 14px;border-radius:10px;margin-bottom:14px;box-shadow:0 2px 8px rgba(28,122,63,.06)}
.err{background:#fdecec;border:1px solid #f4c1c1;color:#c0392b;padding:11px 14px;border-radius:10px;margin-bottom:14px;box-shadow:0 2px 8px rgba(192,57,43,.06)}
.note,.hint{color:#7a8597;font-size:13px;margin:6px 0 14px;line-height:1.7}
.empty{color:#8a94a6;text-align:center;padding:40px 0}

/* buttons */
.btn-primary{background:linear-gradient(180deg,#2b7df0 0%,#1f6feb 100%);color:#fff;border:0;padding:11px 18px;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;display:inline-block;box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 4px 10px rgba(31,111,235,.28);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;letter-spacing:.02em}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 6px 14px rgba(31,111,235,.36);filter:brightness(1.04)}
.btn-primary:active{transform:translateY(0);filter:brightness(.97)}
.btn-sub{background:#fff;color:#33415c;border:1px solid #d4dcea;padding:9px 14px;border-radius:9px;cursor:pointer;font-size:14px;font-weight:600;transition:background .15s ease,border-color .15s ease,transform .15s ease}
.btn-sub:hover{background:#f5f8fc;border-color:#bcc8db}
.btn-sub.small{padding:5px 10px;font-size:12px}
.link{background:none;border:0;color:#1f6feb;cursor:pointer;font-size:14px;padding:0;font-weight:600}
.link:hover{text-decoration:underline}
.link-danger{background:none;border:0;color:#d0454c;cursor:pointer;font-size:14px;padding:0;font-weight:600}
.link-danger:hover{text-decoration:underline}

/* login */
.bare{background:radial-gradient(ellipse at top,#2a3548 0%,#161d28 70%);min-height:100vh;display:flex;align-items:center;justify-content:center}
.login-box{background:#fff;border-radius:18px;padding:34px 26px;width:88%;max-width:360px;box-shadow:0 30px 80px rgba(0,0,0,.4),0 2px 0 rgba(255,255,255,.05) inset}
.login-box h1{margin:0 0 4px;font-size:22px;text-align:center;letter-spacing:.02em}
.login-box .sub{text-align:center;color:#8a94a6;margin:0 0 22px;font-size:13px}
.login-box label{display:block;margin-bottom:14px;font-size:13px;color:#5b6577;font-weight:600}
.login-box input{width:100%;padding:13px;border:1px solid #d4dcea;border-radius:11px;font-size:16px;margin-top:6px;transition:border-color .15s ease,box-shadow .15s ease}
.login-box input:focus{outline:0;border-color:#1f6feb;box-shadow:0 0 0 3px rgba(31,111,235,.18)}
.login-box button{width:100%;background:linear-gradient(180deg,#2b7df0 0%,#1f6feb 100%);color:#fff;border:0;padding:14px;border-radius:11px;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 6px 16px rgba(31,111,235,.34);transition:transform .15s ease,filter .15s ease}
.login-box button:hover{transform:translateY(-1px);filter:brightness(1.04)}
.login-box button:active{transform:translateY(0)}

/* forms */
.form label{display:block;margin-bottom:14px;font-size:13px;color:#5b6577;font-weight:600}
.form input,.form textarea,.form select{width:100%;padding:11px;border:1px solid #d4dcea;border-radius:10px;font-size:16px;margin-top:5px;font-family:inherit;background:#fff;transition:border-color .15s ease,box-shadow .15s ease}
.form input:focus,.form textarea:focus,.form select:focus{outline:0;border-color:#1f6feb;box-shadow:0 0 0 3px rgba(31,111,235,.18)}
.form input[type=color]{height:44px;padding:4px;cursor:pointer}
.form input[type=checkbox]{width:auto;margin:0 6px 0 0}
.form small{color:#9aa4b5;font-weight:400;font-size:12px}
.form fieldset{border:1px solid #e0e6ef;border-radius:12px;padding:14px;margin:0 0 16px;background:rgba(255,255,255,.4)}
.form legend{font-size:13px;color:#33415c;font-weight:700;padding:0 6px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.url-row{display:flex;align-items:center;gap:4px;margin-top:5px}
.url-row span{color:#8a94a6;font-size:13px;white-space:nowrap}
.form-actions{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.toggle-row{display:flex;align-items:center}

/* cards / lists */
.cards{display:flex;flex-direction:column;gap:14px}
.card{background:#fff;border-radius:14px;padding:16px;box-shadow:0 1px 2px rgba(20,30,50,.04),0 6px 18px rgba(20,30,50,.06);border:1px solid rgba(20,30,50,.04);transition:transform .15s ease,box-shadow .15s ease}
.card:hover{transform:translateY(-1px);box-shadow:0 1px 2px rgba(20,30,50,.04),0 10px 24px rgba(20,30,50,.09)}
.card-title{font-weight:700;font-size:16px;margin-bottom:6px;letter-spacing:.02em}
.card-meta{display:flex;flex-wrap:wrap;gap:6px}
.chip{background:#eef2f8;color:#5b6577;border-radius:20px;padding:3px 10px;font-size:12px;font-weight:600}
.chip.on{background:#e6f7ec;color:#1c7a3f}
.card-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:12px;padding-top:10px;border-top:1px solid #eef1f5;font-size:14px}
.card-actions form{margin:0}
.list{display:flex;flex-direction:column;gap:8px}
.list-row{background:#fff;border-radius:12px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid rgba(20,30,50,.04);transition:background .15s ease}
.list-row:hover{background:#fafbfd}
.lr-title{font-weight:600}
.lr-meta{color:#8a94a6;font-size:12px;margin-top:3px;display:flex;gap:6px;align-items:center}
.lr-actions{display:flex;gap:12px;align-items:center;flex:0 0 auto;font-size:14px}
.lr-actions form{margin:0}

/* tables */
.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;font-size:14px;box-shadow:0 1px 2px rgba(20,30,50,.04),0 4px 14px rgba(20,30,50,.05)}
.tbl th,.tbl td{padding:11px 12px;text-align:left;border-bottom:1px solid #eef1f5}
.tbl tr:last-child td{border-bottom:0}
.tbl th{background:#f5f8fc;color:#5b6577;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.tbl tr:hover td{background:#fafbfd}

/* profile list table */
.pp-tbl td{padding:9px 10px;vertical-align:middle}
.pp-tbl .pp-title{font-weight:700;color:#1a2233;font-size:14px;text-decoration:none}
.pp-tbl .pp-title:hover{color:#1f6feb}
.pp-tbl .pp-lock{margin-left:4px;font-size:12px}
.pp-tbl .pp-slug{color:#5b6577;font-size:12px;font-family:ui-monospace,monospace}
.pp-tbl .pp-slug:hover{color:#1f6feb}
.pp-tbl .pp-owner{font-size:12px;color:#5b6577;white-space:nowrap}
.pp-tbl .pp-owner .dim{color:#cdd6e2}
.pp-tbl .pp-rev{font-size:12px;color:#7a8597;text-align:center}
.pp-tbl .pp-act{text-align:right;white-space:nowrap;display:flex;gap:4px;justify-content:flex-end;align-items:center;flex-wrap:nowrap}
.pp-tbl .pp-act .btn-sub.small{padding:5px 8px;font-size:12px}
.pp-tbl .pp-act form{margin:0}
.pp-tbl .pp-lock-act{font-size:11px;color:#a07000;background:#fff8e7;border:1px solid #f0d590;padding:4px 8px;border-radius:6px;white-space:nowrap}

/* builder */
.builder-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;position:sticky;top:0;z-index:5;background:rgba(238,241,245,.92);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:6px 4px;border-radius:10px}
.bb-status{font-size:13px;color:#1c7a3f;font-weight:600}
.block-list{display:flex;flex-direction:column;gap:10px}
.blk-card{background:#fff;border-radius:12px;padding:12px;display:flex;align-items:center;gap:10px;box-shadow:0 1px 2px rgba(20,30,50,.04),0 4px 12px rgba(20,30,50,.05);border:1px solid rgba(20,30,50,.04);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.blk-card:hover{transform:translateY(-1px);box-shadow:0 1px 2px rgba(20,30,50,.04),0 6px 16px rgba(20,30,50,.08);border-color:#cdd6e2}
.blk-card.off{opacity:.5}
.bc-handle{cursor:grab;color:#b3bccb;font-size:20px;touch-action:none;padding:4px;border-radius:6px;transition:color .15s ease,background .15s ease}
.bc-handle:hover{color:#5b6577;background:#f5f8fc}
.bc-handle:active{cursor:grabbing}
.bc-icon{font-size:22px;width:32px;text-align:center}
.bc-body{flex:1;display:flex;flex-direction:column;cursor:pointer;overflow:hidden;gap:2px}
.bc-body b,.bc-body strong{font-size:14px;letter-spacing:.02em;font-weight:700}
.bc-body small{color:#9aa4b5;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-eye,.bc-dup{background:none;border:0;font-size:18px;cursor:pointer;width:34px;height:34px;border-radius:8px;transition:background .15s ease,color .15s ease}
.bc-eye:hover,.bc-dup:hover{background:#f5f8fc;color:#33415c}
.bc-dup{font-size:17px;color:#8a94a6}
.bc-del{background:none;border:0;font-size:14px;cursor:pointer;width:34px;height:34px;border-radius:8px;color:#c3cad6;transition:background .15s ease,color .15s ease}
.bc-del:hover{background:#fdecec;color:#d0454c}

/* builder layout: ヘッダー下を2カラム（左=ブロック / 右=プレビュー） */
.builder-cols{display:flex;gap:28px;align-items:flex-start}
.builder-main{flex:1 1 0;min-width:0}
.builder-side{flex:0 0 auto;width:440px;position:sticky;top:0}
@media(min-width:900px){
  .builder-cols{gap:36px}
}
.preview-label{font-size:12px;color:#7a8597;margin-bottom:6px;font-weight:600;letter-spacing:.04em;display:flex;align-items:center;gap:10px}
.preview-label #reloadPreview{color:#1f6feb;cursor:pointer;font-weight:600;margin-left:auto}
.preview-label #reloadPreview:hover{text-decoration:underline}
.preview-tabs{display:inline-flex;gap:2px;background:#eef2f8;border-radius:8px;padding:2px}
.preview-tab{background:transparent;border:0;padding:5px 12px;border-radius:6px;font-size:12px;color:#5b6577;cursor:pointer;font-weight:500;letter-spacing:.04em;transition:all .15s ease}
.preview-tab:hover{color:#1f6feb}
.preview-tab.on{background:#fff;color:#1f6feb;box-shadow:0 1px 3px rgba(20,30,50,.10)}
.preview-host{
  border:1px solid #d4dcea;border-radius:14px;background:#fff;
  overflow:auto;height:78vh;
  box-shadow:0 1px 2px rgba(20,30,50,.04),0 8px 24px rgba(20,30,50,.08);
  /* contain は layout style だけ（paintを外す：内部のscroll/overflowを邪魔しない） */
  contain:layout style;
  position:relative;
}
/* PCモード時もscrollは効く（Shadow DOM 側の scaler が縮小後boxサイズになる） */

/* modal */
.modal{position:fixed;inset:0;background:rgba(15,20,30,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:50;display:flex;align-items:flex-end;justify-content:center;animation:adFadeIn .18s ease}
.modal[hidden]{display:none}
.modal-inner{background:#fff;width:100%;max-width:560px;border-radius:18px 18px 0 0;max-height:88vh;display:flex;flex-direction:column;box-shadow:0 -10px 40px rgba(15,20,30,.25);animation:adSlideUp .22s cubic-bezier(.2,.9,.3,1)}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid #eef1f5;font-weight:700;font-size:15px;letter-spacing:.02em}
.modal-head .x{background:none;border:0;font-size:24px;cursor:pointer;color:#8a94a6;width:34px;height:34px;border-radius:8px;transition:background .15s ease,color .15s ease}
.modal-head .x:hover{background:#f5f8fc;color:#33415c}
.edit-form{padding:18px;overflow-y:auto}
.modal-foot{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-top:1px solid #eef1f5;background:#fafbfd;border-radius:0 0 0 0}
.picker-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;padding:18px;overflow-y:auto}
.picker-cat{grid-column:1/-1;font-size:12px;font-weight:700;color:#1f6feb;letter-spacing:.06em;padding:8px 2px 0;border-bottom:1px solid #e3e8ef;padding-bottom:6px;margin-bottom:2px}
.picker-cat:first-child{padding-top:0}
.pick{background:linear-gradient(180deg,#fafbfd 0%,#f3f6fb 100%);border:1px solid #e0e6ef;border-radius:12px;padding:14px 6px;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;cursor:pointer;font-weight:600;color:#33415c;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease}
.pick:hover{transform:translateY(-2px);background:#fff;border-color:#1f6feb;box-shadow:0 6px 16px rgba(31,111,235,.12),0 1px 2px rgba(31,111,235,.06);color:#1f6feb}
.pick span{font-size:26px;line-height:1}
@keyframes adFadeIn{from{opacity:0}to{opacity:1}}
@keyframes adSlideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* edit form fields */
.fld{margin-bottom:14px}
/* 編集フォームの区切り見出し（クリックで開閉） */
.fld-section{display:flex;align-items:center;gap:8px;width:calc(100% + 8px);margin:20px -4px 12px;padding:10px 14px;background:linear-gradient(90deg,rgba(31,111,235,.10),transparent);border:0;border-left:3px solid #1f6feb;border-radius:0 8px 8px 0;font-weight:600;font-size:13px;color:#1f6feb;letter-spacing:.06em;cursor:pointer;text-align:left;font-family:inherit}
.fld-section:first-child{margin-top:0}
.fld-section:hover{background:linear-gradient(90deg,rgba(31,111,235,.16),transparent)}
.fld-section .fs-arrow{font-size:10px;flex:0 0 auto;transition:transform .15s ease}
.fld-section.closed .fs-arrow{transform:rotate(-90deg)}
.fld>label{display:block;font-size:13px;color:#5b6577;font-weight:600;margin-bottom:5px}
.fld input,.fld textarea,.fld select{width:100%;padding:10px;border:1px solid #d4dcea;border-radius:9px;font-size:16px;font-family:inherit;transition:border-color .15s ease,box-shadow .15s ease;background:#fff}
.fld input:focus,.fld textarea:focus,.fld select:focus{outline:0;border-color:#1f6feb;box-shadow:0 0 0 3px rgba(31,111,235,.18)}
.fld input[type=color]{height:42px;padding:4px;cursor:pointer}
.repeater{display:flex;flex-direction:column;gap:10px}
.rep-row{background:#f5f8fc;border:1px solid #e3e8ef;border-radius:10px;padding:10px 12px 10px 32px;display:flex;flex-direction:column;gap:6px;position:relative}
.rep-row.sortable-ghost{opacity:.5}
.rep-row.sortable-chosen{background:#eef3fb}
.rep-handle{position:absolute;top:8px;left:6px;bottom:8px;width:22px;display:flex;align-items:center;justify-content:center;cursor:grab;color:#b3bccb;font-size:18px;touch-action:none;user-select:none;border-radius:6px;line-height:1}
.rep-handle:hover{color:#5b6577;background:rgba(31,111,235,.08)}
.rep-handle:active{cursor:grabbing}
.rep-fld{display:grid;grid-template-columns:84px 1fr;align-items:center;gap:8px 10px;width:100%}
.rep-fld small{color:#5b6577;font-size:12px;font-weight:600;text-align:right;margin:0}
.rep-fld small.rep-hint{grid-column:2;text-align:left;color:#9aa4b5;font-size:10px;font-weight:400;line-height:1.4;margin-top:-2px}
.rep-fld input,.rep-fld textarea,.rep-fld select{width:100%;padding:8px 10px;border:1px solid #d4dcea;border-radius:8px;font-size:14px;font-family:inherit;background:#fff}
.rep-fld input:focus,.rep-fld textarea:focus,.rep-fld select:focus{outline:0;border-color:#1f6feb;box-shadow:0 0 0 3px rgba(31,111,235,.18)}
.rep-fld textarea{min-height:54px;resize:vertical;align-self:start}
.rep-fld .img-fld{display:flex;flex-direction:column;gap:6px}
.rep-del{position:absolute;top:6px;right:8px;background:#fdecec;border:0;color:#d0454c;border-radius:6px;padding:3px 8px;font-size:11px;cursor:pointer}
.rep-del:hover{background:#fbd5d5}
.img-fld{display:flex;flex-direction:column;gap:8px}
.img-preview{min-height:40px}
.img-preview img{max-height:160px;border-radius:8px}

/* rich text */
.rt-toolbar{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.rt-toolbar button{background:#eef2f8;border:1px solid #d4dcea;border-radius:7px;padding:7px 11px;cursor:pointer;font-size:14px}
.rt-toolbar input[type=color]{width:40px;height:36px;padding:2px;border:1px solid #d4dcea;border-radius:7px}
.rt-editor{min-height:240px;border:1px solid #d4dcea;border-radius:10px;padding:12px;margin-top:6px;background:#fff;font-size:16px;line-height:1.7}
.rt-editor img{max-width:100%;border-radius:6px}

/* survey builder */
.q-list{display:flex;flex-direction:column;gap:12px;margin:10px 0}
.q-box{background:#f5f8fc;border-radius:12px;padding:12px}
.q-top{display:flex;gap:6px;align-items:center}
.q-top .q-text{flex:1}
.q-req{display:flex;align-items:center;gap:4px;font-size:13px;color:#5b6577;margin-top:8px;font-weight:600}
.q-req input{width:auto;margin:0}
.q-opts{margin-top:10px;display:flex;flex-direction:column;gap:6px;padding-left:8px}
.pane{display:none}
.head-actions{display:flex;gap:8px;align-items:center}

/* ユーザー管理 */
.sec{font-size:16px;margin:24px 0 12px}
.creds-box{background:#e6f7ec;border:1px solid #b7e2c6;border-radius:12px;padding:14px;margin-bottom:18px}
.creds-title{font-weight:700;color:#1c7a3f;margin-bottom:8px}
.creds-box textarea{width:100%;border:1px solid #b7e2c6;border-radius:8px;padding:10px;font-family:ui-monospace,monospace;font-size:14px;background:#fff;resize:none;box-sizing:border-box}
.creds-box small{display:block;color:#5b6577;margin-top:6px;font-size:12px}
.chk-list{display:flex;flex-direction:column;gap:7px;margin:6px 0 14px}
.chk{display:flex;align-items:center;gap:8px;font-weight:400;font-size:14px}
.chk input{width:auto;margin:0}
.chk small{color:#9aa4b5}
.assign-det{margin:8px 0}
.assign-det summary{cursor:pointer;color:#1f6feb;font-size:14px;padding:4px 0}

/* ファイル管理 */
.file-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.file-card{background:#fff;border-radius:12px;padding:10px;box-shadow:0 2px 8px rgba(20,30,50,.06)}
.file-thumb{position:relative;border-radius:8px;overflow:hidden;background:#11151c;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center}
.file-thumb img,.file-thumb video{width:100%;height:100%;object-fit:cover}
.file-badge{position:absolute;top:6px;left:6px;background:rgba(0,0,0,.65);color:#fff;font-size:10px;padding:2px 6px;border-radius:4px}
.file-url{width:100%;font-size:11px;font-family:ui-monospace,monospace;border:1px solid #d4dcea;border-radius:6px;padding:6px;margin:8px 0 6px;box-sizing:border-box}
.file-actions{display:flex;justify-content:space-between;align-items:center;gap:8px}
.file-actions form{margin:0}

/* QR */
.qr-wrap{background:#fff;border-radius:14px;padding:20px;text-align:center;box-shadow:0 2px 10px rgba(20,30,50,.06)}
#qrcode{display:inline-block;padding:10px;background:#fff}
#qrcode img,#qrcode canvas{display:block}
.qr-url{display:flex;gap:8px;margin:16px 0;align-items:center}
.qr-url input{flex:1;border:1px solid #d4dcea;border-radius:8px;padding:8px;font-size:12px;font-family:ui-monospace,monospace}
.qr-actions{display:flex;gap:10px;justify-content:center;align-items:center}

/* analytics */
.stat-row{display:flex;gap:12px;margin-bottom:16px}
.stat-card{flex:1;background:#fff;border-radius:14px;padding:18px;text-align:center;box-shadow:0 1px 2px rgba(20,30,50,.04),0 6px 18px rgba(20,30,50,.06);border:1px solid rgba(20,30,50,.04);position:relative;overflow:hidden}
.stat-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#1f6feb,#5aa6ff)}
.stat-num{font-size:30px;font-weight:700;color:#1f6feb;letter-spacing:.02em;line-height:1.1}
.stat-label{font-size:12px;color:#7a8597;margin-top:6px;font-weight:600;letter-spacing:.04em}
.chart-box{background:#fff;border-radius:14px;padding:16px;height:230px;box-shadow:0 1px 2px rgba(20,30,50,.04),0 6px 18px rgba(20,30,50,.06);border:1px solid rgba(20,30,50,.04)}
.opt-row{display:flex;gap:6px;align-items:center}
.opt-row input{flex:1}

/* responses / inbox */
.resp-card{background:#fff;border-radius:12px;padding:14px;margin-bottom:10px}
.resp-card.done{opacity:.6}
.resp-date{font-size:12px;color:#9aa4b5;margin-bottom:6px}
.resp-row{display:flex;gap:10px;padding:4px 0;font-size:14px;border-bottom:1px dashed #eef1f5}
.resp-q{color:#5b6577;font-weight:600;min-width:90px}
.cand-list{margin:8px 0;padding-left:18px}

/* settings */
.bg-pane{margin-top:10px}
.op-list{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.op-item{position:relative;width:80px;height:120px}
.op-item img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.op-item .rep-del{position:absolute;top:-6px;right:-6px;width:24px;height:24px}

/* ── サイドバーレイアウト ─────────────────────────────── */
body.has-sidebar{min-height:100vh}
.app-sidebar{width:220px;min-width:220px;background:linear-gradient(180deg,#222b3a 0%,#1b2330 100%);position:fixed;top:0;left:0;bottom:0;display:flex;flex-direction:column;z-index:10;overflow-y:auto}
.sb-brand{padding:17px 16px 14px;font-size:14px;font-weight:700;letter-spacing:.04em;color:#fff;border-bottom:1px solid rgba(255,255,255,.08);text-decoration:none;display:block;white-space:nowrap}
.sb-nav{flex:1;padding:10px 8px;display:flex;flex-direction:column;gap:2px}
.sb-nav a{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:8px;color:#cdd6e2;font-size:13px;font-weight:500;text-decoration:none;transition:background .15s,color .15s;white-space:nowrap;overflow:hidden}
.sb-nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.sb-nav a.on{background:#1f6feb;color:#fff}
.sb-nav a.on:hover{background:#1f6feb}
.sb-nav .sb-sep{height:1px;background:rgba(255,255,255,.08);margin:6px 0}
.sb-profile{padding:12px 14px 6px;border-bottom:1px solid rgba(255,255,255,.06)}
.sb-profile-title{font-weight:700;font-size:12px;color:#e2e8f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}
.sb-profile-slug{font-size:10px;color:#5b6577;font-family:ui-monospace,monospace}
.sb-footer{padding:10px 8px;border-top:1px solid rgba(255,255,255,.08)}
.sb-footer a{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;color:#7a8597;font-size:13px;text-decoration:none;transition:color .15s,background .15s}
.sb-footer a:hover{color:#fff;background:rgba(255,255,255,.06)}
.sb-footer .sb-pub{color:#cdd6e2;font-size:12px}

/* メインコンテンツ */
.sb-body{margin-left:220px}

/* 有効期限アラートバー */
.expiry-bar{padding:10px 20px;font-size:13px;font-weight:600;background:#fff8e7;border-bottom:1px solid #f0d590;color:#a07000}
.expiry-bar.expired{background:#fdecec;border-color:#f4c1c1;color:#c0392b}

/* モバイル: サイドバー非表示 */
.sb-mini{display:none}
.sb-tab{display:none}
@media(max-width:768px){
  body.has-sidebar{display:block}
  .app-sidebar{display:none}
  .sb-body{margin-left:0}
  .sb-mini{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(180deg,#222b3a 0%,#1b2330 100%);color:#fff;padding:10px 16px;position:sticky;top:0;z-index:10;box-shadow:0 1px 0 rgba(0,0,0,.3),0 4px 12px rgba(15,20,30,.2)}
  .sb-mini .brand{color:#fff;font-weight:700;font-size:14px;text-decoration:none}
  .sb-mini nav a{color:#cdd6e2;margin-left:12px;font-size:13px;text-decoration:none}
  .sb-mini nav a:hover{color:#fff}
  .sb-tab{display:flex;gap:4px;overflow-x:auto;padding:8px 14px;background:#fff;border-bottom:1px solid #e3e8ef;position:sticky;top:44px;z-index:9;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .sb-tab::-webkit-scrollbar{display:none}
  .sb-tab a{flex:0 0 auto;padding:7px 12px;border-radius:8px;color:#5b6577;font-size:13px;font-weight:600;white-space:nowrap;text-decoration:none}
  .sb-tab a:hover{background:#f5f8fc}
  .sb-tab a.on{background:#1f6feb;color:#fff}
  .sb-profile-bar{padding:10px 16px 4px;font-weight:700;font-size:15px}
  .sb-profile-bar .slug{color:#8a94a6;font-size:12px;font-weight:400}
}

/* テンプレート選択グリッド */
.tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:16px 0}
.tpl-card{background:#fff;border:2px solid #e3e8ef;border-radius:14px;padding:18px 12px 14px;text-align:center;cursor:pointer;transition:all .15s ease;display:flex;flex-direction:column;align-items:center;gap:6px}
.tpl-card:hover{border-color:#1f6feb;transform:translateY(-2px);box-shadow:0 6px 20px rgba(31,111,235,.12)}
.tpl-card.selected,.tpl-card input:checked+.tpl-card-inner{border-color:#1f6feb}
.tpl-card input[type=radio]{position:absolute;opacity:0;pointer-events:none}
.tpl-icon{font-size:30px;line-height:1}
.tpl-label{font-weight:700;font-size:13px;color:#33415c;margin-top:4px}

/* 有効期限チップ */
.chip-expiry{padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700}
.chip-expired{background:#fdecec;color:#c0392b}
.chip-warn{background:#fff8e7;color:#a07000}
.chip-ok{background:#e6f7ec;color:#1c7a3f}
.chip-none{background:#eef2f8;color:#5b6577}

/* マイページ プロフィールカード */
.my-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-top:8px}
.my-card{background:#fff;border-radius:14px;padding:18px;box-shadow:0 1px 2px rgba(20,30,50,.04),0 6px 18px rgba(20,30,50,.06);border:1px solid rgba(20,30,50,.04);display:flex;flex-direction:column;gap:10px;transition:transform .15s,box-shadow .15s}
.my-card:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(20,30,50,.06),0 10px 24px rgba(20,30,50,.09)}
.my-card-title{font-weight:700;font-size:16px;color:#1a2233}
.my-card-meta{display:flex;gap:6px;flex-wrap:wrap}
.my-card-actions{display:flex;gap:8px;padding-top:8px;border-top:1px solid #eef1f5}
.my-card-actions a{flex:1;text-align:center;padding:9px 8px;border-radius:9px;font-size:13px;font-weight:700;text-decoration:none}
.my-card-actions .btn-edit{background:linear-gradient(180deg,#2b7df0,#1f6feb);color:#fff;box-shadow:0 3px 8px rgba(31,111,235,.28)}
.my-card-actions .btn-view{background:#f5f8fc;color:#33415c;border:1px solid #d4dcea}

/* ユーティリティ */
.chip-mono{font-family:ui-monospace,monospace}
.sec-first{margin-top:0}
.card-form{padding:20px;margin-bottom:20px}
.btn-primary.btn-block{width:100%;padding:14px;font-size:16px}
.expiry-bar-block{border-radius:10px;margin-bottom:20px}

/* マイページ 期限切れ */
.my-expired{text-align:center;padding:70px 20px}
.my-expired-icon{font-size:56px;margin-bottom:16px}
.my-expired h2{font-size:22px;margin:0 0 10px;color:#1a2233}
.my-expired p{color:#7a8597;margin:0 0 28px;line-height:1.8}

/* テンプレート一覧（my/template_list） */
.tpl-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.tpl-c{background:#fff;border-radius:14px;border:1px solid #e3e8ef;display:flex;flex-direction:column;overflow:hidden;transition:box-shadow .15s,transform .15s}
.tpl-c:hover{box-shadow:0 6px 24px rgba(20,30,50,.1);transform:translateY(-2px)}
.tpl-c-head{padding:20px 18px 14px;border-bottom:1px solid #eef1f5}
.tpl-c-icon{font-size:30px;margin-bottom:8px}
.tpl-c-label{font-weight:700;font-size:15px;color:#1a2233;margin-bottom:5px}
.tpl-c-desc{font-size:12px;color:#5b6577;line-height:1.65}
.tpl-c-chips{padding:12px 18px;display:flex;flex-wrap:wrap;gap:4px;flex:1}
.tpl-c-chip{background:#f0f4fa;color:#4a5568;font-size:11px;padding:3px 8px;border-radius:20px;white-space:nowrap}
.tpl-c-foot{padding:12px 14px;border-top:1px solid #eef1f5;display:flex;flex-direction:column;gap:7px}
.tpl-c-link{display:block;text-align:center;padding:9px;border-radius:9px;font-size:13px;font-weight:600;text-decoration:none;background:#f0f4fa;color:#33415c;border:1px solid #d4dcea}
.tpl-c-btn{width:100%;padding:9px;border-radius:9px;font-size:13px;font-weight:700;background:linear-gradient(180deg,#2b7df0,#1f6feb);color:#fff;border:0;cursor:pointer}

/* テンプレートデモ（my/template_demo） */
.tpl-info-blocks-label{padding:12px 20px 4px;font-size:11px;font-weight:700;color:#8a94a6;letter-spacing:.06em}
.tpl-info-empty{padding:20px;color:#8a94a6;font-size:13px;text-align:center}

/* 使い方ガイド（my/manual） */
.man-wrap{max-width:760px}
.man-sec{background:#fff;border-radius:14px;border:1px solid #e3e8ef;margin-bottom:20px;overflow:hidden}
.man-sec-head{padding:18px 22px;border-bottom:1px solid #eef1f5;display:flex;align-items:center;gap:10px}
.man-sec-head h2{margin:0;font-size:16px;color:#1a2233}
.man-sec-icon{font-size:22px;flex:0 0 auto}
.man-sec-body{padding:18px 22px;font-size:13px;color:#33415c;line-height:1.8}
.man-sec-body p{margin:0 0 12px}
.man-sec-body p:last-child{margin-bottom:0}
.man-step{display:flex;gap:14px;margin-bottom:12px;align-items:flex-start}
.man-step-num{flex:0 0 26px;height:26px;border-radius:50%;background:#1f6feb;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:1px}
.man-step-num-icon{background:#f0f4fa;color:#1f6feb;font-size:16px;width:32px;height:32px;flex:0 0 32px}
.man-step-body{flex:1}
.man-step-title{font-weight:700;margin-bottom:2px;color:#1a2233}
.man-step-desc{font-size:12px;color:#5b6577;line-height:1.65}
.man-tag{display:inline-block;background:#f0f4fa;color:#33415c;font-size:11px;padding:2px 8px;border-radius:4px;font-weight:600;font-family:ui-monospace,monospace;vertical-align:middle}
.man-tip{background:#fffbea;border:1px solid #f0d590;border-radius:8px;padding:10px 14px;font-size:12px;color:#7a5c00;margin-top:10px;line-height:1.65}
.man-tip::before{content:"💡 "}
.man-warn{background:#fff1f2;border:1px solid #f4c1c1;border-radius:8px;padding:10px 14px;font-size:12px;color:#922;margin-top:10px;line-height:1.65}
.man-warn::before{content:"⚠️ "}
.man-toc{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.man-toc a{padding:7px 14px;border-radius:9px;border:1px solid #d4dcea;background:#fff;font-size:13px;font-weight:600;text-decoration:none;color:#33415c;transition:all .15s}
.man-toc a:hover{background:#f0f4fa;border-color:#aab4c8}
.man-cta{text-align:center;padding:8px 0 16px}

/* ── 使い方ガイド: 図解（man-fig）とモックアップ（mk-*） ── */
.man-fig{background:#f6f8fb;border:1px solid #e3e8ef;border-radius:12px;padding:18px 14px 12px;margin:14px 0;text-align:center}
.man-fig-cap{font-size:11px;color:#7a8597;margin-top:10px}
/* 汎用モック部品 */
.mk-pad{padding:10px;display:flex;flex-direction:column;gap:6px;align-items:stretch}
.mk-center{align-items:center;text-align:center}
.mk-row{flex-direction:row;justify-content:center;gap:8px}
.mk-h{font-size:13px;font-weight:800;color:#1a2233;text-align:center}
.mk-h.sm{font-size:11px}
.mk-line{height:6px;border-radius:3px;background:#dbe2ec}
.mk-line.short{width:60%}
.mk-cap{font-size:9px;color:#7a8597;line-height:1.4}
.mk-cap.b{font-weight:700;color:#33415c;font-size:10px}
.mk-btn{display:inline-block;background:#1f6feb;color:#fff;font-size:10px;font-weight:700;padding:6px 14px;border-radius:99px;white-space:nowrap}
.mk-btn.sm{padding:4px 12px;align-self:center}
.mk-btn.full{display:block;text-align:center}
.mk-btn.green{background:#28a745}
.mk-btn.dark{background:#333}
.mk-btn.line{background:#06c755}
.mk-input{border:1px solid #d9dee6;border-radius:6px;background:#fff;font-size:9px;color:#a8b1c0;padding:5px 8px;text-align:left}
.mk-input.tall{padding:5px 8px 18px}
.mk-card{border:1px solid #e3e8ef;border-radius:8px;background:#fff;padding:7px 8px;display:flex;flex-direction:column;gap:5px;text-align:left}
.mk-tag{display:inline-block;background:#eef3fb;color:#1f6feb;font-size:8px;font-weight:700;border-radius:4px;padding:1px 6px;align-self:flex-start}
.mk-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#dbe6f5,#c3d3ea);display:flex;align-items:center;justify-content:center;font-size:20px}
.mk-avatar.sm{width:26px;height:26px;font-size:13px;flex:0 0 26px}
/* 個別ブロックモック */
.mk-hero{position:relative;border-radius:8px;background:linear-gradient(160deg,#31415e,#1b2537);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:120px;padding:10px}
.mk-hero-logo{font-size:9px;font-weight:800;letter-spacing:.2em;border:1px solid rgba(255,255,255,.5);border-radius:4px;padding:2px 8px}
.mk-hero-t{font-size:12px;font-weight:800}
.mk-hero-s{font-size:8px;color:#c6d2e4}
.mk-hero-arrow{position:absolute;bottom:6px;font-size:10px;color:#c6d2e4}
.mk-banner{border-radius:6px;background:linear-gradient(135deg,#cfe0f5,#a9c4e8);min-height:38px;display:flex;align-items:center;justify-content:center;font-size:16px}
.mk-cbanner{border-radius:8px;background:linear-gradient(135deg,#1f6feb,#5b8ef5);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:52px;padding:8px;font-size:8px}
.mk-cbanner .b{font-size:11px;font-weight:800}
.mk-carousel{display:flex;gap:4px;overflow:hidden}
.mk-slide{flex:0 0 72%;border-radius:6px;background:linear-gradient(135deg,#cfe0f5,#a9c4e8);min-height:44px;display:flex;align-items:center;justify-content:center;font-size:14px}
.mk-slide.half{flex:0 0 40%}
.mk-dots{text-align:center;font-size:6px;color:#8a94a6;letter-spacing:2px}
.mk-radio{font-size:9px;color:#4a5568;text-align:left}
.mk-sns{width:26px;height:26px;border-radius:50%;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px;margin:0 2px}
.mk-map{border-radius:6px;background:repeating-linear-gradient(45deg,#dfe9d8,#dfe9d8 8px,#d3e2cc 8px,#d3e2cc 16px);min-height:44px;display:flex;align-items:center;justify-content:center;font-size:16px}
.mk-coupon{border:1.5px dashed #e1306c;border-radius:8px;background:#fff5f8;color:#c2255c;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px;font-size:8px}
.mk-coupon .b{font-size:10px;font-weight:800}
.mk-code{background:#fff;border:1px solid #f4c1d4;border-radius:4px;padding:1px 8px;font-family:ui-monospace,monospace;font-size:8px}
.mk-video{border-radius:6px;background:#1b2330;color:#fff;min-height:56px;display:flex;align-items:center;justify-content:center;font-size:16px}
.mk-dl{display:flex;align-items:center;gap:7px;border:1px solid #e3e8ef;border-radius:8px;background:#fff;padding:7px 8px;text-align:left}
.mk-dl>div{flex:1;display:flex;flex-direction:column;gap:4px}
.mk-dl-ic{font-size:16px}
.mk-dl-btn{background:#33415c;color:#fff;border-radius:6px;font-size:10px;padding:3px 7px}
.mk-tl{display:flex;gap:7px;align-items:flex-start;text-align:left}
.mk-tl>div{flex:1;display:flex;flex-direction:column;gap:4px}
.mk-dot{width:8px;height:8px;border-radius:50%;background:#1f6feb;margin-top:2px;flex:0 0 8px;box-shadow:0 12px 0 0 #d4dcea}
.mk-faq{display:flex;justify-content:space-between;border:1px solid #e3e8ef;border-radius:6px;background:#fff;padding:5px 8px;font-size:9px;font-weight:700;color:#33415c}
.mk-faq.open{border-bottom-left-radius:0;border-bottom-right-radius:0;margin-bottom:-6px}
.mk-faq-a{border:1px solid #e3e8ef;border-top:none;border-radius:0 0 6px 6px;background:#f6f8fb;padding:5px 8px;font-size:8px;color:#5b6577;text-align:left}
.mk-plan{flex:1;border:1px solid #e3e8ef;border-radius:8px;background:#fff;padding:8px 6px;display:flex;flex-direction:column;align-items:center;gap:3px}
.mk-plan.hot{border-color:#1f6feb;background:#f3f8ff}
.mk-voice{display:flex;gap:7px;align-items:flex-start;border:1px solid #e3e8ef;border-radius:8px;background:#fff;padding:8px}
.mk-voice>div{flex:1;display:flex;flex-direction:column;gap:5px}
.mk-modal{display:grid;grid-template-columns:1fr 1fr;gap:4px;border:1px solid #d4dcea;border-radius:8px;background:#fff;padding:6px;box-shadow:0 6px 16px rgba(15,20,30,.12);width:80%}
.mk-modal span{background:linear-gradient(135deg,#cfe0f5,#a9c4e8);border-radius:4px;min-height:24px;display:flex;align-items:center;justify-content:center;font-size:11px}
/* ログイン画面図解 */
.mk-phone{width:190px;margin:0 auto;border:2px solid #d4dcea;border-radius:18px;background:#fff;padding:16px 12px;box-shadow:0 8px 24px rgba(15,20,30,.08)}
.mk-login{display:flex;flex-direction:column;gap:8px}
.mk-login-logo{font-size:12px;font-weight:800;color:#1a2233;text-align:center;margin-bottom:4px}
/* 編集画面レイアウト図解 */
.mk-editor{display:flex;gap:6px;max-width:420px;margin:0 auto;text-align:left}
.mk-ed-label{font-size:10px;font-weight:700;color:#5b6577;margin-bottom:6px;line-height:1.5}
.mk-ed-side{flex:0 0 34px;background:linear-gradient(180deg,#222b3a,#1b2330);border-radius:8px;display:flex;align-items:center;justify-content:center;padding:8px 0}
.mk-ed-side .mk-ed-label{color:#cdd6e2;margin:0;text-align:center}
.mk-ed-list{flex:1.2;background:#fff;border:1px solid #e3e8ef;border-radius:8px;padding:8px}
.mk-ed-item{border:1px solid #e3e8ef;border-radius:6px;background:#f8fafc;font-size:9px;color:#33415c;padding:5px 7px;margin-bottom:4px;white-space:nowrap;overflow:hidden}
.mk-ed-add{border:1.5px dashed #aab4c8;border-radius:6px;font-size:9px;color:#5b6577;text-align:center;padding:5px}
.mk-ed-prev{flex:.8;background:#fff;border:1px solid #e3e8ef;border-radius:8px;padding:8px;display:flex;flex-direction:column}
.mk-ed-phone{flex:1;border:1.5px solid #d4dcea;border-radius:10px;background:#f6f8fb;display:flex;align-items:center;justify-content:center;font-size:18px;min-height:64px}
/* ブロックカード図解 */
.mk-bcard{display:flex;align-items:center;gap:8px;max-width:320px;margin:0 auto;background:#fff;border:1px solid #d4dcea;border-radius:10px;padding:10px 12px;box-shadow:0 2px 8px rgba(15,20,30,.06)}
.mk-bc-handle{color:#8a94a6;font-size:15px;cursor:grab}
.mk-bc-icon{font-size:15px}
.mk-bc-label{flex:1;font-size:12px;font-weight:700;color:#1a2233;text-align:left}
.mk-bc-btns{display:flex;gap:6px}
.mk-bc-btns span{border:1px solid #d4dcea;border-radius:6px;padding:2px 7px;font-size:11px;background:#f8fafc}
/* 横幅デモ */
.mk-widths{max-width:280px;margin:0 auto;display:flex;flex-direction:column;gap:6px}
.mk-w-demo{display:flex;gap:4px}
.mk-w-demo span{background:#dbe7fa;border:1px solid #b7cdf3;color:#2c5fb8;border-radius:6px;font-size:9px;font-weight:700;padding:6px 0;text-align:center}
.mk-w-demo .w100{flex:0 0 100%}
.mk-w-demo .w50{flex:0 0 calc(50% - 2px)}
.mk-w-demo .w33{flex:1}
/* ブロック図鑑 */
.man-cat{font-size:13px;font-weight:800;color:#1f6feb;letter-spacing:.06em;margin:22px 0 10px;padding-bottom:6px;border-bottom:2px solid #dbe7fa}
.man-cat:first-of-type{margin-top:8px}
.man-block{display:flex;gap:16px;border:1px solid #e8edf4;border-radius:12px;padding:14px;margin-bottom:12px;background:#fcfdfe}
.man-block-mock{flex:0 0 150px;max-width:150px;background:#f2f5fa;border:1px solid #e3e8ef;border-radius:10px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.man-block-mock .mk-pad{width:100%;box-sizing:border-box}
.man-block-body{flex:1;min-width:0}
.man-block-title{font-weight:800;font-size:14px;color:#1a2233;margin-bottom:4px;display:flex;align-items:center;gap:7px}
.man-block-icon{font-size:17px}
.man-block-desc{font-size:12px;color:#5b6577;line-height:1.7;margin-bottom:8px}
.man-block-set{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.man-block-set-label{font-size:10px;font-weight:700;color:#8a94a6;margin-right:2px}
.man-block-chip{background:#eef2f8;color:#4a5568;font-size:10px;border-radius:99px;padding:2px 9px;line-height:1.6}
.man-block-tip{margin-top:8px;font-size:11px;color:#7a5c00;background:#fffbea;border:1px solid #f0d590;border-radius:7px;padding:6px 10px;line-height:1.6}
@media (max-width:560px){
  .man-block{flex-direction:column}
  .man-block-mock{flex:none;max-width:200px;margin:0 auto}
  .mk-editor{max-width:100%}
}
/* サイドバー: 使い方ガイドの強調リンク */
.sb-guide{display:flex;align-items:center;gap:8px;margin:10px 8px 0;padding:10px 12px;border-radius:10px;background:linear-gradient(135deg,rgba(31,111,235,.35),rgba(91,142,245,.2));border:1px solid rgba(120,165,245,.45);color:#fff;font-size:13px;font-weight:700;text-decoration:none;transition:background .15s}
.sb-guide:hover{background:linear-gradient(135deg,rgba(31,111,235,.55),rgba(91,142,245,.35))}

/* ウェルカムモーダル（layout_editor.php） */
.wm-overlay{display:none;position:fixed;inset:0;background:rgba(15,20,30,.6);z-index:100;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.wm-box{background:#fff;border-radius:20px;padding:32px 28px;max-width:440px;width:90%;box-shadow:0 24px 64px rgba(15,20,30,.3);animation:adFadeIn .2s ease}
.wm-emoji{font-size:28px;text-align:center;margin-bottom:8px}
.wm-title{margin:0 0 6px;font-size:18px;text-align:center;color:#1a2233}
.wm-lead{font-size:13px;color:#5b6577;text-align:center;margin:0 0 24px;line-height:1.7}
.wm-items{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}
.wm-item{display:flex;gap:14px;align-items:flex-start;background:#f5f8fc;border-radius:12px;padding:14px}
.wm-item-icon{font-size:24px;flex:0 0 auto}
.wm-item-title{font-weight:700;font-size:14px;color:#1a2233;margin-bottom:3px}
.wm-item-desc{font-size:12px;color:#5b6577;line-height:1.6}
.wm-actions{display:flex;gap:8px}
.wm-link{flex:1;text-align:center;padding:12px;border-radius:10px;font-size:13px;font-weight:700;text-decoration:none;background:#f0f4fa;color:#33415c;border:1px solid #d4dcea}
.wm-btn{flex:1;padding:12px;border-radius:10px;font-size:13px;font-weight:700;background:linear-gradient(180deg,#2b7df0,#1f6feb);color:#fff;border:0;cursor:pointer}
/* ── subpages (ヘッダー&フッター) エディター ── */
.sp-section{background:#fff;border-radius:14px;border:1px solid #e3e8ef;padding:20px;margin-bottom:20px}
.sp-section-h{font-size:16px;font-weight:700;color:#1a2233;margin:0 0 12px}
.sp-section-h small{font-size:12px;color:#7a8597;font-weight:400}
.sp-toggle{display:flex;align-items:center;gap:8px;margin-bottom:14px;font-size:14px;font-weight:500;cursor:pointer}
.sp-block-list{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.sp-block{background:#f8fafc;border:1px solid #e3e8ef;border-radius:10px;overflow:hidden}
.sp-block-head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#f0f4fa}
.sp-block-toggle{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;cursor:pointer}
.sp-block-acts{display:flex;gap:4px}
.sp-act-btn{background:none;border:1px solid #d4dcea;border-radius:6px;padding:3px 8px;font-size:13px;cursor:pointer;color:#4a5568;line-height:1.4}
.sp-act-btn:hover{background:#e8ecf2}
.sp-act-btn.danger{color:#e74c3c;border-color:#f8c4c4}
.sp-act-btn.danger:hover{background:#fff0f0}
.sp-block-fields{padding:14px;display:flex;flex-direction:column;gap:10px}
.sp-field{display:flex;flex-direction:column;gap:4px;font-size:13px}
.sp-field-row{flex-direction:row;align-items:center;gap:8px}
.sp-field span{font-weight:600;color:#4a5568}
.sp-field input[type=text],.sp-field select,.sp-field textarea{padding:8px 10px;border:1px solid #d9dee6;border-radius:8px;font-size:14px;font-family:inherit;width:100%;box-sizing:border-box}
.sp-field input[type=color]{height:34px;width:52px;padding:2px 3px;border:1px solid #d9dee6;border-radius:6px;cursor:pointer}
.sp-add-row{display:flex;gap:8px;align-items:center}
.sp-add-row select{flex:1;padding:8px 10px;border:1px solid #d9dee6;border-radius:8px;font-size:14px;font-family:inherit}

/* ── プロプラン / ページ管理 ── */
.pro-badge{background:#f5a623;color:#fff;font-size:11px;font-weight:700;padding:3px 8px;border-radius:20px;letter-spacing:.04em}
.my-pro-bar{display:flex;align-items:center;gap:12px;margin-bottom:18px;padding:12px 16px;background:#fffbf2;border:1px solid #f5c26c;border-radius:10px}
.btn-pages{font-size:14px;font-weight:600;color:#1a2233;text-decoration:none;padding:6px 14px;background:#fff;border:1px solid #d9dee6;border-radius:8px}
.btn-pages:hover{background:#f0f4fa}
.btn-del{background:none;border:1px solid #f8c4c4;border-radius:6px;padding:4px 8px;font-size:13px;color:#e74c3c;cursor:pointer}
.btn-del:hover{background:#fff0f0}
.pages-profile-meta{margin:-4px 0 18px;font-size:13px}
.pages-list{display:flex;flex-direction:column;gap:10px}
.pages-item{background:#fff;border:1px solid #e3e8ef;border-radius:10px;padding:14px 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pages-item-top{background:#f8fafc}
.pages-title{font-size:15px;font-weight:700;min-width:120px}
.pages-url{font-size:12px;color:#8a94a6;font-family:monospace;flex:1}
.pages-acts{display:flex;gap:8px;align-items:center}
.sb-sp-label{padding:12px 16px;font-size:13px;font-weight:700;color:#4a5568;line-height:1.6}
.sb-sp-label small{font-size:12px;color:#8a94a6;font-weight:400;display:block}
.form-url-preview{display:flex;align-items:center;border:1px solid #d9dee6;border-radius:8px;overflow:hidden;background:#fff}
.form-url-base{padding:8px 10px;background:#f0f4fa;color:#8a94a6;font-size:13px;white-space:nowrap;font-family:monospace}
.form-url-preview input{border:none;border-radius:0;flex:1;padding:8px 10px}
.form-url-preview input:focus{outline:none;box-shadow:none}

/* ── スマホ最適化（管理画面全般 + ビルダー + ブログ投稿） ── */
/* プレビュー開閉ボタン（ビルダー・モバイル専用FAB） */
.pv-fab{display:none}
@media(max-width:768px){
  .wrap{padding:16px 14px calc(96px + env(safe-area-inset-bottom))}
  .page-head{flex-wrap:wrap}
  .grid2{grid-template-columns:1fr}
  .stat-row{flex-wrap:wrap}
  .stat-card{flex:1 1 42%;padding:14px}
  /* テーブルは横スクロールで逃がす（列を潰さない） */
  .tbl{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tbl th,.tbl td{white-space:nowrap}
  /* アンケート設問ビルダー: 設問行を折り返す */
  .q-top{flex-wrap:wrap}
  .q-top .q-text{flex:1 1 100%}

  /* ── ビルダー: 2カラム → 1カラム + プレビューは全画面オーバーレイ ── */
  .builder-cols{display:block}
  /* 追加ボタンはタブバー(sb-mini 44px + sb-tab 46px)の下に貼り付く */
  .builder-bar{top:90px;padding:8px 6px}
  .builder-side{display:none}
  .builder-side.open{
    display:block;position:fixed;inset:0;z-index:40;width:auto;
    background:#eef1f5;padding:14px 14px calc(76px + env(safe-area-inset-bottom));
    overflow:auto;
  }
  .builder-side.open .preview-host{height:calc(100vh - 130px);height:calc(100dvh - 130px)}
  .pv-fab{
    display:block;position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:45;
    background:linear-gradient(180deg,#2b7df0,#1f6feb);color:#fff;border:0;border-radius:99px;
    padding:13px 20px;font-size:14px;font-weight:700;cursor:pointer;
    box-shadow:0 6px 20px rgba(31,111,235,.42);
  }
  /* ブロックカードのタップ領域を確保 */
  .blk-card{padding:12px 8px 12px 10px;gap:6px}
  .bc-handle{padding:8px 6px}
  .bc-eye,.bc-dup,.bc-del{width:38px;height:38px}

  /* ── ブロック編集モーダル（ボトムシート） ── */
  .modal-inner{max-height:92vh;max-height:94dvh}
  .edit-form{padding:14px}
  .modal-foot{padding:12px 14px calc(12px + env(safe-area-inset-bottom))}
  .modal-foot .btn-primary{flex:1;margin-left:18px;padding:13px 18px}
  .picker-grid{padding:14px;gap:8px}
  .pick{padding:12px 4px}

  /* ── リッチテキスト（ブログ投稿・イベント編集） ── */
  /* ツールバーは入力中も手が届くように上部固定（sb-mini+sb-tab の直下） */
  .rt-toolbar{position:sticky;top:90px;z-index:6;background:#eef1f5;padding:6px 2px;margin:0 -2px;border-radius:8px}
  .rt-toolbar button{padding:10px 13px;font-size:15px;min-width:42px}
  .rt-toolbar input[type=color]{width:44px;height:40px}
  .rt-editor{min-height:280px}

  /* ── フォーム保存ボタンを下部固定（ブログ/イベント/アンケート/ページ編集） ── */
  .form-actions{
    position:sticky;bottom:0;z-index:7;margin:0 -4px;
    padding:10px 4px calc(10px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(238,241,245,0) 0%,rgba(238,241,245,.96) 26%);
  }
  .form-actions .btn-primary{padding:13px 26px}
}