@import "https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700&display=swap";:root{--c-primary:#e8734a;--c-primary-dark:#d4613b;--c-primary-light:#f5a889;--c-indigo:#2c4a6e;--c-indigo-dark:#1b3552;--c-indigo-light:#eef2f7;--c-cream:#faf6f0;--c-warm:#f5ede3;--c-white:#fff;--c-text:#2d2a26;--c-text-muted:#7a7368;--c-border:#e8e2d9;--c-success:#4caf50;--c-warning:#ff9800;--c-danger:#f44336;--c-bg:#fafafa;--ff:"Noto Sans JP", -apple-system, sans-serif;--fs-xs:.75rem;--fs-sm:.875rem;--fs-base:1rem;--fs-lg:1.125rem;--fs-xl:1.25rem;--fs-2xl:1.5rem;--fs-3xl:2rem;--sp-1:.25rem;--sp-2:.5rem;--sp-3:.75rem;--sp-4:1rem;--sp-5:1.25rem;--sp-6:1.5rem;--sp-8:2rem;--sp-10:2.5rem;--sp-12:3rem;--sp-16:4rem;--sp-20:5rem;--radius:12px;--radius-sm:8px;--radius-lg:16px;--shadow:0 2px 12px #00000014;--shadow-lg:0 8px 32px #0000001f}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:var(--ff);color:var(--c-text);background:var(--c-bg);-webkit-font-smoothing:antialiased;line-height:1.7}a{color:var(--c-primary);text-decoration:none}a:hover{text-decoration:underline}img{max-width:100%;display:block}button{cursor:pointer;font-family:var(--ff)}.app{flex-direction:column;min-height:100dvh;display:flex}.app__main{padding:var(--sp-6);flex:1;width:100%;max-width:800px;margin:0 auto}.topbar{background:var(--c-indigo);color:#fff;padding:var(--sp-3) var(--sp-6);z-index:100;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.topbar__logo{align-items:center;gap:var(--sp-2);display:flex}.topbar__logo img{height:32px}.topbar__logo span{font-size:var(--fs-sm);opacity:.9;font-weight:600}.topbar__user{align-items:center;gap:var(--sp-3);display:flex}.topbar__avatar{object-fit:cover;border:2px solid #ffffff4d;border-radius:50%;width:36px;height:36px}.topbar__name{font-size:var(--fs-sm);font-weight:500}.topbar__logout{color:#fff;padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-sm);font-size:var(--fs-xs);background:0 0;border:1px solid #ffffff4d;transition:all .2s}.topbar__logout:hover{background:#ffffff1a}.bottomnav{background:var(--c-white);border-top:1px solid var(--c-border);z-index:100;padding-bottom:env(safe-area-inset-bottom,0);display:flex;position:fixed;bottom:0;left:0;right:0}.bottomnav__item{padding:var(--sp-2) 0;color:var(--c-text-muted);background:0 0;border:none;flex-direction:column;flex:1;align-items:center;font-size:10px;transition:color .2s;display:flex;text-decoration:none!important}.bottomnav__item.active{color:var(--c-primary)}.bottomnav__item svg{width:22px;height:22px;margin-bottom:2px}.card{background:var(--c-white);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--sp-6);margin-bottom:var(--sp-4)}.card--warm{background:var(--c-warm)}.card--indigo{background:var(--c-indigo);color:#fff}.card__title{font-size:var(--fs-lg);margin-bottom:var(--sp-3);font-weight:600}.card__subtitle{font-size:var(--fs-sm);color:var(--c-text-muted);margin-bottom:var(--sp-4)}.btn{justify-content:center;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-6);border-radius:var(--radius-sm);font-weight:600;font-size:var(--fs-sm);border:none;transition:all .2s;display:inline-flex;text-decoration:none!important}.btn--primary{background:var(--c-primary);color:#fff}.btn--primary:hover{background:var(--c-primary-dark)}.btn--outline{border:2px solid var(--c-primary);color:var(--c-primary);background:0 0}.btn--outline:hover{background:var(--c-primary);color:#fff}.btn--dark{background:var(--c-indigo);color:#fff}.btn--danger{background:var(--c-danger);color:#fff}.btn--block{width:100%}.btn--lg{padding:var(--sp-4) var(--sp-8);font-size:var(--fs-base)}.btn--sm{padding:var(--sp-2) var(--sp-4);font-size:var(--fs-xs)}.btn:disabled{opacity:.5;cursor:not-allowed}.qr-card{text-align:center;padding:var(--sp-8)}.qr-card__title{font-size:var(--fs-xl);margin-bottom:var(--sp-2);font-weight:700}.qr-card__plan{padding:var(--sp-1) var(--sp-3);background:var(--c-primary-light);color:var(--c-primary-dark);font-size:var(--fs-sm);margin-bottom:var(--sp-6);border-radius:20px;font-weight:500;display:inline-block}.qr-card__qr{padding:var(--sp-4);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:var(--sp-4);background:#fff;display:inline-block}.qr-card__status{font-size:var(--fs-sm);color:var(--c-text-muted)}.qr-card__status--active{color:var(--c-success);font-weight:600}.stats-grid{gap:var(--sp-3);grid-template-columns:repeat(2,1fr);display:grid}.stat-item{background:var(--c-white);border-radius:var(--radius-sm);padding:var(--sp-4);text-align:center;box-shadow:var(--shadow)}.stat-item__value{font-size:var(--fs-2xl);color:var(--c-primary);font-weight:700}.stat-item__label{font-size:var(--fs-xs);color:var(--c-text-muted);margin-top:var(--sp-1)}.section-header{margin:var(--sp-6) 0 var(--sp-4);justify-content:space-between;align-items:center;display:flex}.section-header__title{font-size:var(--fs-lg);font-weight:600}.list-item{align-items:center;gap:var(--sp-4);padding:var(--sp-4);border-bottom:1px solid var(--c-border);display:flex}.list-item:last-child{border-bottom:none}.list-item__icon{background:var(--c-indigo-light);width:44px;height:44px;color:var(--c-indigo);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.list-item__content{flex:1;min-width:0}.list-item__title{font-weight:500;font-size:var(--fs-sm)}.list-item__sub{font-size:var(--fs-xs);color:var(--c-text-muted)}.list-item__action{flex-shrink:0}.form-group{margin-bottom:var(--sp-4)}.form-group label{font-size:var(--fs-sm);margin-bottom:var(--sp-1);color:var(--c-text);font-weight:500;display:block}.form-group input,.form-group select,.form-group textarea{width:100%;padding:var(--sp-3);border:1px solid var(--c-border);border-radius:var(--radius-sm);font-size:var(--fs-base);font-family:var(--ff);background:var(--c-white);transition:border-color .2s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--c-primary);outline:none;box-shadow:0 0 0 3px #e8734a26}.form-row{gap:var(--sp-3);grid-template-columns:repeat(3,1fr);display:grid}.login-page{background:linear-gradient(135deg, var(--c-indigo) 0%, var(--c-indigo-dark) 100%);color:#fff;min-height:100dvh;padding:var(--sp-8);flex-direction:column;justify-content:center;align-items:center;display:flex}.login-page__logo{margin-bottom:var(--sp-8)}.login-page__logo img{height:60px}.login-page__title{font-size:var(--fs-2xl);margin-bottom:var(--sp-2);font-weight:700}.login-page__sub{font-size:var(--fs-sm);opacity:.8;margin-bottom:var(--sp-10);text-align:center}.login-page__buttons{gap:var(--sp-3);flex-direction:column;width:100%;max-width:320px;display:flex}.btn--line{color:#fff;padding:var(--sp-4) var(--sp-6);border-radius:var(--radius-sm);font-weight:600;font-size:var(--fs-base);justify-content:center;align-items:center;gap:var(--sp-3);background:#06c755;border:none;width:100%;display:flex}.btn--line:hover{background:#05b34c}.btn--google{color:var(--c-text);padding:var(--sp-4) var(--sp-6);border-radius:var(--radius-sm);font-weight:600;font-size:var(--fs-base);justify-content:center;align-items:center;gap:var(--sp-3);border:1px solid var(--c-border);background:#fff;width:100%;display:flex}.btn--google:hover{background:#f5f5f5}.badge{font-size:var(--fs-xs);border-radius:20px;padding:2px 10px;font-weight:600;display:inline-block}.badge--active{color:#2e7d32;background:#e8f5e9}.badge--suspended{color:#e65100;background:#fff3e0}.badge--cancelled{color:#c62828;background:#ffebee}.badge--trial{background:var(--c-indigo-light);color:var(--c-indigo)}.empty-state{text-align:center;padding:var(--sp-12) var(--sp-6);color:var(--c-text-muted)}.empty-state__icon{margin-bottom:var(--sp-4);font-size:48px}.empty-state__text{font-size:var(--fs-sm)}.loading{padding:var(--sp-16);justify-content:center;align-items:center;display:flex}.spinner{border:3px solid var(--c-border);border-top-color:var(--c-primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.app__main{padding-bottom:80px}@media (width>=768px){.bottomnav{display:none}.app__main{padding-bottom:var(--sp-6)}}