/*
Theme Name: POINTAILER
Theme URI: https://pointailer.jp
Author: 株式会社 위딘헬스케어솔루션
Description: 日本向けモニター・体験団募集サイト用テーマ。キャンペーン登録、応募受付、応募者管理、ポイント付与、ブランド問い合わせ、POINTAIL データ取り込み機能を含みます。
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: pointailer
*/

/* Layout: mobile webview app column (max 480px) for the public site; full-screen admin console (max 1080px) layered on top for editors */
:root{
  --bg:#f3f4f8; --surface:#ffffff; --ink:#1b1d2a; --sub:#6b6f82; --line:#e6e7ee;
  --brand:#ff4f6d; --brand-2:#ff8a5c; --brand-soft:#ffe9ed; --point:#ff4f6d; --navy:#262a4a; --on-navy:#ffffff;
  --ok:#1aa37a; --ok-soft:#e3f6ef; --warn:#c96d00; --warn-soft:#fff2df; --muted-soft:#eceef3;
  --f-display:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN",sans-serif;
  --f-body:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
  --f-admin:"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --f-num:"Outfit","Noto Sans JP",sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0f1017; --surface:#1a1c27; --ink:#f1f2f7; --sub:#9a9eb3; --line:#2a2d3c;
  --brand:#ff6680; --brand-2:#ff9a70; --brand-soft:#3a1d26; --point:#ff7a90; --navy:#2b3060; --on-navy:#f1f2f7;
  --ok:#3fcf9d; --ok-soft:#173329; --warn:#ffad4a; --warn-soft:#3a2a14; --muted-soft:#252836; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0f1017; --surface:#1a1c27; --ink:#f1f2f7; --sub:#9a9eb3; --line:#2a2d3c;
  --brand:#ff6680; --brand-2:#ff9a70; --brand-soft:#3a1d26; --point:#ff7a90; --navy:#2b3060; --on-navy:#f1f2f7;
  --ok:#3fcf9d; --ok-soft:#173329; --warn:#ffad4a; --warn-soft:#3a2a14; --muted-soft:#252836; color-scheme:dark}

*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:14px;line-height:1.6}
button{font:inherit;color:inherit;cursor:pointer}
button:disabled{opacity:.5;cursor:default}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.app{max-width:480px;margin:0 auto;background:var(--surface);min-height:100%;padding-bottom:84px;position:relative}

/* header */
.hd{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--surface);border-bottom:1px solid var(--line)}
.hd-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px}
.logo{display:flex;align-items:center;gap:6px;font-family:var(--f-num);font-weight:800;font-size:20px;letter-spacing:.02em}
.logo-mark{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,var(--brand),var(--brand-2));display:grid;place-items:center;color:#fff;font-size:15px}
.logo b{color:var(--brand)}
.hd-right{display:flex;gap:6px;align-items:center}
.hd-pt{display:flex;align-items:center;gap:6px;background:var(--brand-soft);color:var(--point);border:0;border-radius:99px;padding:5px 12px;font-family:var(--f-num);font-weight:800;font-size:13px}
.hd-pt i{font-style:normal;width:18px;height:18px;border-radius:50%;background:var(--point);color:#fff;display:grid;place-items:center;font-size:11px}
.admin-btn{border:1px solid var(--ink);background:var(--ink);color:var(--surface);border-radius:8px;padding:4px 10px;font-family:var(--f-admin);font-size:12px;font-weight:700}
.tabs{display:flex;gap:4px;padding:0 12px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{border:0;background:none;padding:10px 10px 12px;font-weight:700;color:var(--sub);white-space:nowrap;position:relative}
.tab[aria-selected="true"]{color:var(--ink)}
.tab[aria-selected="true"]::after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:3px;border-radius:3px;background:var(--ink)}

/* banner */
.banner-wrap{padding:14px 16px 4px}
.banner{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:16/8;max-width:100%;background:var(--muted-soft)}
.slides{display:flex;height:100%;transition:transform .45s ease}
.slide{flex:0 0 100%;padding:20px 22px;display:flex;flex-direction:column;justify-content:center;gap:6px;color:#fff;position:relative;background-size:cover;background-position:center}
.slide.has-img::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.5),rgba(0,0,0,.05))}
.slide > *{position:relative}
.slide h2{margin:0;font-family:var(--f-display);font-weight:800;font-size:22px;line-height:1.3;text-wrap:balance}
.slide p{margin:0;font-size:12.5px;opacity:.92}
.slide .tagl{align-self:flex-start;background:rgba(255,255,255,.22);border-radius:99px;padding:2px 10px;font-size:11px;font-weight:700}
.slide .deco{position:absolute;right:-18px;bottom:-26px;font-family:var(--f-num);font-weight:800;font-size:110px;opacity:.16;line-height:1}
.dots{position:absolute;right:12px;bottom:10px;background:rgba(0,0,0,.28);color:#fff;border-radius:99px;padding:1px 9px;font-family:var(--f-num);font-size:11px}

/* quick menu */
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:16px 12px 6px}
.qbtn{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11.5px;font-weight:500;color:var(--ink)}
.qicon{width:48px;height:48px;border-radius:16px;background:var(--bg);display:grid;place-items:center}
.qbtn[aria-pressed="true"] .qicon{background:var(--brand-soft);color:var(--brand)}
.qicon svg{width:24px;height:24px}

/* sections */
.sec{padding:22px 16px 6px}
.sec-hd{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}
.sec-hd h3{margin:0;font-family:var(--f-display);font-weight:800;font-size:18px}
.sec-hd h3 em{font-style:normal;color:var(--brand)}
.more{font-size:12px;color:var(--sub);border:0;background:none}
.filters{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-bottom:14px}
.filters::-webkit-scrollbar{display:none}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:5px 12px;font-size:12px;white-space:nowrap;color:var(--sub)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--surface);border-color:var(--ink);font-weight:700}

.grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 10px}
.card{border:0;background:none;text-align:left;padding:0;display:flex;flex-direction:column;gap:6px;min-width:0}
.thumb{position:relative;aspect-ratio:1/1;max-width:100%;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:var(--muted-soft)}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.thumb .ph{font-family:var(--f-num);font-weight:800;font-size:15px;letter-spacing:.08em;color:rgba(20,20,40,.5);text-align:center;padding:0 10px}
.badges{position:absolute;left:8px;top:8px;display:flex;flex-wrap:wrap;gap:4px}
.bdg{font-size:10px;font-weight:700;border-radius:4px;padding:1px 6px;background:var(--surface);color:var(--ink)}
.bdg.q{background:#e9374b;color:#fff}.bdg.r{background:#bf0000;color:#fff}.bdg.a{background:#232f3e;color:#fff}
.bdg.ig{background:linear-gradient(90deg,#f58529,#dd2a7b);color:#fff}.bdg.x{background:#111;color:#fff}
.dday{position:absolute;right:8px;bottom:8px;font-family:var(--f-num);font-weight:600;font-size:11px;background:rgba(20,20,30,.72);color:#fff;border-radius:4px;padding:1px 6px}
.c-title{font-size:13px;line-height:1.45;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.9em}
.c-price{display:flex;align-items:baseline;gap:6px;font-size:11.5px;color:var(--sub)}
.c-pt{display:flex;align-items:center;gap:4px;font-family:var(--f-num);font-weight:800;font-size:16px;color:var(--point)}
.c-pt small{font-family:var(--f-body);font-size:11px;font-weight:700}
.c-pt .rate{font-size:11px;background:var(--brand-soft);border-radius:4px;padding:0 5px}
.c-tags{display:flex;flex-wrap:wrap;gap:4px}
.c-tags span{font-size:10.5px;border-radius:4px;padding:1px 6px;background:var(--muted-soft);color:var(--sub);font-weight:500}
.c-tags span:first-child{background:var(--brand-soft);color:var(--brand)}
.bar{height:4px;border-radius:4px;background:var(--line);overflow:hidden}
.bar i{display:block;height:100%;background:var(--ink)}
.c-meta{display:flex;justify-content:space-between;font-size:11px;color:var(--sub);font-variant-numeric:tabular-nums}
.c-meta b{color:var(--ink)}
.empty{grid-column:1/-1;text-align:center;color:var(--sub);padding:30px 0}

.how{background:var(--bg);margin-top:22px;padding:24px 16px}
.how h3{margin:0 0 4px;font-family:var(--f-display);font-weight:800;font-size:18px}
.how > p{margin:0 0 16px;color:var(--sub);font-size:12.5px}
.steps{display:grid;gap:10px}
.step{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:center;background:var(--surface);border-radius:14px;padding:14px}
.step-n{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-family:var(--f-num);font-weight:800;font-size:15px}
.step h4{margin:0;font-size:14px}
.step p{margin:2px 0 0;font-size:12px;color:var(--sub)}
.rate-box{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:10px;background:var(--navy);color:var(--on-navy);border-radius:14px;padding:14px;font-weight:700}
.rate-box span{font-family:var(--f-num);font-weight:800;font-size:22px}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:20px 16px 0}
.stat{text-align:center;padding:12px 4px;border:1px solid var(--line);border-radius:12px;min-width:0}
.stat b{display:block;font-family:var(--f-num);font-weight:800;font-size:18px}
.stat span{font-size:11px;color:var(--sub)}

.faq details{border-bottom:1px solid var(--line);padding:12px 0}
.faq summary{list-style:none;cursor:pointer;font-weight:700;font-size:13.5px;display:flex;gap:8px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";font-family:var(--f-num);color:var(--brand);font-weight:800}
.faq details p{margin:8px 0 0 20px;color:var(--sub);font-size:12.5px;white-space:pre-line}

.biz{margin:24px 16px 0;border-radius:16px;padding:20px;background:var(--navy);color:var(--on-navy);display:grid;gap:8px}
.biz small{font-weight:700;opacity:.75;letter-spacing:.08em;font-size:11px}
.biz h3{margin:0;font-family:var(--f-display);font-weight:800;font-size:18px;line-height:1.4;white-space:pre-line}
.biz p{margin:0;font-size:12.5px;opacity:.85}
.biz button{justify-self:start;margin-top:6px;border:0;border-radius:10px;padding:10px 16px;background:var(--surface);color:var(--ink);font-weight:700}

.ft{padding:28px 16px 20px;color:var(--sub);font-size:11px;line-height:1.8}
.ft nav{display:flex;flex-wrap:wrap;gap:4px 14px;margin-bottom:10px;font-weight:700;color:var(--ink)}

.bnav{position:fixed;left:0;right:0;bottom:0;z-index:30;padding-bottom:env(safe-area-inset-bottom,0px);background:var(--surface);border-top:1px solid var(--line)}
.bnav-in{max-width:480px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr)}
.bnav button{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 0 10px;font-size:10.5px;color:var(--sub)}
.bnav button[aria-current="page"]{color:var(--ink);font-weight:700}
.bnav svg{width:22px;height:22px}

/* sheet */
.dim{position:fixed;inset:0;background:rgba(10,10,20,.5);z-index:40}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:50;max-width:480px;margin:0 auto;background:var(--surface);border-radius:20px 20px 0 0;max-height:88%;overflow-y:auto;padding:8px 16px calc(20px + env(safe-area-inset-bottom,0px))}
.grab{width:40px;height:4px;border-radius:4px;background:var(--line);margin:4px auto 12px}
.sheet h3{margin:0 0 4px;font-family:var(--f-display);font-weight:800;font-size:18px;line-height:1.4}
.sheet .lead{margin:0 0 14px;color:var(--sub);font-size:12.5px}
.sheet-img{width:100%;aspect-ratio:1/1;max-width:100%;object-fit:cover;border-radius:14px;margin-bottom:12px;background:var(--muted-soft)}
.dl{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;background:var(--bg);border-radius:12px;padding:14px;font-size:12.5px;margin:0 0 14px}
.dl dt{color:var(--sub)} .dl dd{margin:0;font-weight:500;min-width:0}
.mission{margin:0 0 16px;padding:0;list-style:none;display:grid;gap:8px}
.mission li{display:grid;grid-template-columns:22px 1fr;gap:8px;font-size:12.5px}
.mission li b{width:22px;height:22px;border-radius:50%;background:var(--ink);color:var(--surface);display:grid;place-items:center;font-family:var(--f-num);font-size:11px}
.note{font-size:12px;color:var(--sub);background:var(--bg);border-radius:10px;padding:10px 12px;margin:0 0 14px;white-space:pre-line}
form{display:grid;gap:10px}
label{font-size:12px;font-weight:700;display:grid;gap:4px}
input,select,textarea{font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:10px;padding:10px 12px;width:100%;min-width:0}
.check{display:flex;gap:8px;align-items:flex-start;font-weight:400;font-size:12px}
.check input{width:auto;margin-top:3px}
.err{color:var(--brand);font-size:11.5px;min-height:1em;margin:0}
.cta{border:0;border-radius:12px;padding:14px;font-weight:700;font-size:15px;background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff}
.done{text-align:center;padding:20px 0 6px}
.done .ok{width:56px;height:56px;border-radius:50%;margin:0 auto 10px;background:var(--ok-soft);color:var(--ok);display:grid;place-items:center;font-size:26px;font-weight:800}
.myapp{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:12px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.myapp small{color:var(--sub);grid-column:1/-1}
.st{font-size:11px;font-weight:700;border-radius:99px;padding:2px 9px;white-space:nowrap;align-self:start}
.st-applied{background:var(--muted-soft);color:var(--sub)}.st-won{background:var(--brand-soft);color:var(--brand)}
.st-mission{background:var(--warn-soft);color:var(--warn)}.st-paid{background:var(--ok-soft);color:var(--ok)}.st-lost{background:var(--muted-soft);color:var(--sub)}
.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:var(--ink);color:var(--surface);border-radius:99px;padding:8px 16px;font-size:12.5px;z-index:90;max-width:calc(100% - 32px);text-align:center}


/* ---- WordPress additions ---- */
.app a{color:inherit;text-decoration:none}
.card{color:inherit}
.detail{padding:16px 16px 30px}
.detail .sheet-img{border-radius:14px}
.detail h1{margin:0 0 4px;font-family:var(--f-display);font-weight:800;font-size:20px;line-height:1.4}
.detail .lead{margin:0 0 14px;color:var(--sub);font-size:12.5px}
.back{display:inline-flex;gap:4px;align-items:center;font-size:12.5px;color:var(--sub);padding:12px 16px 0}
.login-box{display:grid;gap:8px}
.login-box a{display:block;text-align:center;border-radius:12px;padding:12px;font-weight:700;border:1px solid var(--line)}
.login-box a.cta{border:0;color:#fff}
.page-body{padding:20px 16px 40px;font-size:13.5px;line-height:1.8}
.page-body h1{font-family:var(--f-display);font-size:20px;margin:0 0 14px}
.page-body h2{font-size:16px;margin:24px 0 8px}
.page-body img{height:auto}
.ft a{color:inherit}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}
body.admin-bar .hd{top:calc(env(safe-area-inset-top,0px) + 46px)}
@media (min-width:783px){body.admin-bar .hd{top:calc(env(safe-area-inset-top,0px) + 32px)}}
/* base reset (WordPress has none) */
html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}
.bnav a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 0 10px;font-size:10.5px;color:var(--sub);text-decoration:none}
.bnav a[aria-current="page"]{color:var(--ink);font-weight:700}
.bnav a svg{width:22px;height:22px}
a.slide{color:#fff;text-decoration:none}
a.admin-btn,a.hd-pt{text-decoration:none}