/* DBFREE Modules Unified UI v1.1 */
:root{
  --primary:#0057B8;
  --primary-2:#1A6FD6;
  --accent:#36A9E1;
  --navy:#1B2430;
  --ink:#0B1F3A;
  --text:#24364B;
  --muted:#6B7A90;
  --line:#E3EAF3;
  --bg:#F7F8FA;
  --surface:#FFFFFF;
  --success:#28A745;
  --warning:#FFC107;
  --danger:#DC3545;
  --radius:16px;
  --shadow:0 10px 30px rgba(14,36,66,.08);
  --shadow-sm:0 4px 14px rgba(14,36,66,.06);
}
*{box-sizing:border-box}
body{
  font-family:Inter,"Noto Sans JP",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  margin:0;
  background:
    radial-gradient(circle at 18% 0%, rgba(54,169,225,.14), transparent 32%),
    linear-gradient(180deg,#fff 0%,var(--bg) 45%,#EEF4FB 100%);
  color:var(--text);
  line-height:1.75;
  letter-spacing:.01em;
}
a{color:var(--primary);text-decoration:none}
a:hover{color:var(--primary-2)}
.wrap{max-width:1040px;margin:44px auto;padding:0 22px}
.wrap.narrow{max-width:560px}
h1,h2,h3{color:var(--ink);line-height:1.35}
h1{font-size:30px;margin:0 0 12px;font-weight:850;letter-spacing:-.02em}
h2{font-size:20px;margin:0 0 16px;font-weight:850}
.lead{color:var(--muted);margin:0 0 26px}
.card{
  background:rgba(255,255,255,.94);
  border:1px solid rgba(227,234,243,.95);
  border-radius:var(--radius);
  padding:24px;
  box-shadow:var(--shadow-sm);
  margin-bottom:20px;
  backdrop-filter:blur(8px);
}
.card:hover{box-shadow:var(--shadow)}
label{display:block;font-weight:750;margin:14px 0 7px;color:var(--ink)}
input[type=text],input[type=password],input[type=email],input[type=url],input[type=number],input[type=date],input[type=month],input[type=tel],input[type=file],textarea,select{
  width:100%;
  padding:12px 13px;
  border:1px solid #C9D4E2;
  border-radius:12px;
  font-size:15px;
  background:#fff;
  color:var(--text);
  outline:none;
  transition:border-color .18s,box-shadow .18s;
}
input:focus,textarea:focus,select:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(0,87,184,.12);
}
textarea{min-height:130px;resize:vertical}
.check{font-weight:500;color:var(--text)}
.alert{padding:13px 16px;border-radius:14px;margin:16px 0;border:1px solid transparent}
.alert.success,.success{background:#ECFDF3!important;border-color:#BAE7C8!important;color:#0B6B20!important}
.alert.error,.error,.errors{background:#FFF1F2!important;border-color:#F4B7BF!important;color:#9B1111!important}
button,.button,.primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff!important;
  border:0;
  border-radius:12px;
  padding:11px 18px;
  min-height:42px;
  text-decoration:none;
  font-size:15px;
  font-weight:750;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(0,87,184,.18);
  transition:transform .14s,box-shadow .14s,opacity .14s;
}
button:hover,.button:hover,.primary:hover{color:#fff!important;transform:translateY(-1px);box-shadow:0 12px 22px rgba(0,87,184,.24)}
.secondary,.sub{
  background:#fff!important;
  color:var(--primary)!important;
  border:1px solid #BFD4EC!important;
  box-shadow:none!important;
}
.secondary:hover,.sub:hover{background:#F3F8FF!important;color:var(--primary)!important}
.danger{background:linear-gradient(135deg,#DC3545,#B91C1C)!important;color:#fff!important}
.muted,.small{color:var(--muted);font-size:13px}
.inline{display:inline}
.badge{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  font-size:12px;
  padding:4px 10px;
  background:#EDF2F7;
  color:#526274;
  font-weight:850;
  white-space:nowrap;
}
.badge.on,.badge.new{background:#DCFCE7;color:#166534}
.badge.off,.badge.important{background:#FEE2E2;color:#991B1B}
.required{background:#FEE2E2;color:#991B1B;border-radius:999px;font-size:12px;padding:2px 8px;margin-left:8px}
.optional{background:#E7EAEE;color:#555;border-radius:999px;font-size:12px;padding:2px 8px;margin-left:8px}
.admin-layout{display:flex;min-height:100vh}
.side{
  width:286px;
  background:linear-gradient(180deg,#081A2F 0%,#0E2746 58%,#08213E 100%);
  color:#fff;
  padding:24px 18px;
  box-sizing:border-box;
  position:sticky;
  top:0;
  height:100vh;
  box-shadow:12px 0 40px rgba(8,26,47,.18);
}
.side h2{color:#fff;font-size:20px;margin:0;letter-spacing:-.02em;display:flex;align-items:center;gap:10px}
.side h2:before{
  content:"";
  width:34px;height:34px;
  border-radius:10px;
  background:linear-gradient(135deg,#0057B8,#36A9E1);
  display:inline-block;
  box-shadow:inset -9px -9px 0 rgba(255,255,255,.18);
}
.side .muted{color:#AFC5DE;margin:6px 0 20px}
.side a{
  display:flex;
  align-items:center;
  gap:10px;
  color:#DCEBFC;
  text-decoration:none;
  padding:11px 12px;
  border-radius:12px;
  margin:5px 0;
  font-weight:700;
  transition:background .15s,transform .15s,color .15s;
}
.side a:before{
  content:"";
  width:8px;height:8px;border-radius:99px;
  background:rgba(54,169,225,.65);
}
.side a.active,.side a:hover{
  background:linear-gradient(135deg,rgba(0,87,184,.96),rgba(26,111,214,.92));
  color:#fff;
  transform:translateX(2px);
}
.side a.active:before,.side a:hover:before{background:#fff}
.main{flex:1;padding:28px;box-sizing:border-box;max-width:calc(100vw - 286px)}
.main>h1{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px 22px;
  margin-bottom:20px;
  box-shadow:var(--shadow-sm);
}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{border-bottom:1px solid var(--line);padding:11px 12px;vertical-align:top;font-size:14px}
th{background:#F4F7FB;text-align:left;color:var(--ink);font-weight:850}
tr:last-child td{border-bottom:0}
.kpi-grid,.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}
.kpi,.stats-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
  box-shadow:var(--shadow-sm);
  position:relative;
  overflow:hidden;
}
.kpi:after,.stats-card:after{
  content:"";
  position:absolute;
  right:-26px;top:-26px;
  width:90px;height:90px;
  border-radius:999px;
  background:rgba(54,169,225,.13);
}
.kpi .num,.stats-card .num{font-size:34px;font-weight:900;color:var(--ink);letter-spacing:-.04em}
.filter{display:flex;gap:10px;align-items:end;flex-wrap:wrap}
.filter>div{flex:1;min-width:180px}
.download-list,.faq-list{display:grid;gap:14px}
.download-item,.faq-item{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
  box-shadow:var(--shadow-sm);
}
.download-item{display:flex;gap:16px;align-items:flex-start}
.file-icon,.qmark{
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  border-radius:12px;
  padding:10px 8px;
  min-width:58px;
  text-align:center;
  font-weight:850;
}
.download-title{font-size:19px;font-weight:850;margin:0 0 4px;color:var(--ink)}
.download-button{background:linear-gradient(135deg,#0F766E,#14A398)!important}
.faq-item{padding:0;overflow:hidden}
.faq-item summary{cursor:pointer;list-style:none;padding:18px;font-weight:850;display:flex;gap:10px;align-items:center;color:var(--ink)}
.faq-item summary::-webkit-details-marker{display:none}
.qmark{width:32px;height:32px;line-height:12px;min-width:32px;border-radius:999px}
.answer{border-top:1px solid var(--line);padding:18px}
.popular ol{margin-bottom:0}
.meta{color:var(--muted);font-size:13px}
.code{
  background:#081A2F;
  color:#DCEBFC;
  padding:15px;
  border-radius:14px;
  overflow:auto;
  white-space:pre-wrap;
  border:1px solid rgba(255,255,255,.08);
}
.report{background:#fff;padding:34px;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-sm)}
.report h1{border-bottom:3px solid var(--primary);padding-bottom:12px}
.report-section{margin:28px 0}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.powered{text-align:center;margin-top:24px;color:var(--muted);font-size:13px}
@media(max-width:980px){
  .admin-layout{display:block}
  .side{position:relative;width:auto;height:auto}
  .main{max-width:none;padding:18px}
  .kpi-grid,.grid{grid-template-columns:1fr 1fr}
  .download-item{display:block}
  .file-icon{display:inline-block;margin-bottom:10px}
}
@media(max-width:620px){
  .kpi-grid,.grid{grid-template-columns:1fr}
  .filter{display:block}
}
@media print{
  body{background:#fff}
  .side,.actions,.no-print{display:none!important}
  .admin-layout{display:block}
  .main{max-width:none;padding:0}
  .card,.report{box-shadow:none;border-radius:0}
}
