
:root{--ink:#493b2d;--muted:#897e6e;--yellow:#ffda5d;--pale:#fff2ba;--green:#80ac66;--line:#f0e7d5;--paper:#fffdfa;--bg:#fcf9f0}*{box-sizing:border-box}body{margin:0;font-family:system-ui,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;color:var(--ink);background:var(--bg)}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #d4a928;outline-offset:2px}.app{display:grid;grid-template-columns:242px minmax(0,1fr);min-height:100vh}.side{background:#fffefa;border-right:1px solid var(--line);padding:22px 15px;position:sticky;top:0;height:100vh;overflow:auto}.brand{display:flex;gap:9px;align-items:center;padding:5px 9px 28px;font-size:22px;font-weight:900}.brand .flower{font-size:36px}.brand small{display:block;font-size:9px;letter-spacing:4px;color:#9d8c6b}.nav{display:grid;gap:5px}.nav button{border:0;text-align:left;padding:13px 15px;border-radius:13px;background:transparent;color:var(--ink);font-weight:650}.nav button:hover,.nav button.active{background:#fff0b2}.side-note{margin-top:30px;border-top:1px solid var(--line);padding:20px 9px;color:var(--muted);font-size:12px;line-height:1.8}.content{min-width:0}.top{height:74px;background:#fffefa;display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid var(--line);gap:12px}.top .tag{font-size:12px;color:#8a7d69}.top a{background:#8eb36c;color:white;padding:10px 17px;border-radius:25px;font-size:13px;font-weight:750}.wrap{max-width:1250px;margin:auto;padding:22px 25px 50px}.hero{min-height:248px;border:1px solid #f1e4ad;border-radius:23px;background:radial-gradient(circle at 82% 20%,#fffdf0 0,transparent 36%),linear-gradient(110deg,#ffefab,#fff9df 58%,#e5f2d9);position:relative;overflow:hidden;display:flex;align-items:center;padding:36px 7%}.hero:before{content:'🌻  🌻  🌻  🌻  🌻';position:absolute;bottom:-19px;left:-14px;font-size:75px;letter-spacing:12px;opacity:.57;white-space:nowrap}.hero:after{content:'🌻';position:absolute;right:6%;top:13px;font-size:100px;transform:rotate(18deg);opacity:.82}.hero-content{z-index:1;max-width:600px}.eyebrow{font-size:12px;letter-spacing:2px;color:#99792c;font-weight:800}.hero h1{font-size:clamp(29px,4vw,49px);margin:10px 0;font-weight:900}.hero p{line-height:1.8;margin:0}.hero .sub{font-size:12px;color:#857657;margin-top:12px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:24px 0 13px}.section-head h2{font-size:19px;margin:0}.pill{background:#fff1ba;color:#8b6924;border-radius:99px;padding:5px 10px;font-size:11px;font-weight:750}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:19px;min-width:0;box-shadow:0 5px 18px #9a7e4210}.stat-label{font-size:12px;color:var(--muted)}.stat-value{font-size:29px;font-weight:850;margin:8px 0}.stat-caption{font-size:11px;color:#6f9b57}.chart{height:210px;display:flex;align-items:end;gap:10px;padding:12px 5px 25px;border-bottom:1px solid #e7e0d1}.chart-col{height:100%;flex:1;display:flex;align-items:end;justify-content:center;position:relative}.chart-bar{width:min(55%,38px);background:linear-gradient(#9ec584,#78a95c);border-radius:8px 8px 0 0;min-height:3px}.chart-col:nth-child(even) .chart-bar{background:linear-gradient(#ffe386,#f8c947)}.chart-label{position:absolute;bottom:-23px;font-size:11px;color:var(--muted)}.two{display:grid;grid-template-columns:1.5fr 1fr;gap:15px}.item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #f0ebe1;font-size:13px}.item:last-child{border:0}.item small{color:#aaa093;white-space:nowrap}.quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:16px}.quick a,.quick button{display:block;background:white;border:1px solid var(--line);border-radius:17px;padding:18px;text-align:left;font-weight:800}.quick span{display:block;font-size:30px;margin-bottom:8px}.quick small{display:block;color:var(--muted);font-weight:400;margin-top:7px;line-height:1.5}.page{display:none}.page.active{display:block}.page-title{font-size:29px;margin:8px 0}.page-desc{color:var(--muted);font-size:14px;line-height:1.8;margin-bottom:24px}.record-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.record-card h3{margin:9px 0}.record-card p{font-size:13px;line-height:1.7;color:var(--muted)}.record-card .date{font-size:11px;color:#a49780}.record-card a{color:#658e4b;text-decoration:underline}.empty{color:var(--muted);font-size:13px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{margin:12px 0}.field label{display:block;font-size:12px;font-weight:750;margin-bottom:6px}.field input,.field textarea,.field select{width:100%;border:1px solid #e4d8be;border-radius:10px;padding:11px;background:white;color:var(--ink)}.field textarea{min-height:95px;resize:vertical}.btn{border:0;background:#e9b932;color:#3d3421;border-radius:11px;padding:11px 16px;font-weight:800}.btn.secondary{background:#f5f0e3}.btn.danger{background:#f8e6de;color:#a34c34}.actions{display:flex;gap:9px;flex-wrap:wrap}.notice{background:#fff3cc;border:1px solid #f2dfa0;border-radius:13px;padding:14px;font-size:12px;line-height:1.7;margin-bottom:16px}.links{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.links a{background:white;border:1px solid var(--line);border-radius:14px;padding:17px;font-weight:750}.links small{display:block;color:var(--muted);font-weight:400;margin-top:6px}.footer{text-align:center;font-size:11px;color:#aa9b80;padding:28px 10px}.seed{font-size:26px}.hidden{display:none!important}@media(max-width:1100px){.grid,.quick{grid-template-columns:repeat(2,1fr)}.record-grid,.links{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.app{display:block}.side{position:static;height:auto;padding:9px 12px}.brand{padding:4px 6px;font-size:18px}.brand .flower{font-size:26px}.side-note{display:none}.nav{display:flex;overflow-x:auto;gap:3px}.nav button{white-space:nowrap;font-size:12px;padding:9px 10px}.top{height:53px;padding:0 15px}.top .tag{font-size:10px}.wrap{padding:14px 13px 35px}.hero{min-height:220px;padding:25px 23px}.hero:after{font-size:52px;right:2%}.hero:before{font-size:45px}.two,.form-grid{grid-template-columns:1fr}.record-grid,.links{grid-template-columns:1fr}.quick{grid-template-columns:repeat(2,1fr)}.page-title{font-size:24px}}@media(max-width:390px){.grid{grid-template-columns:1fr}.quick{grid-template-columns:1fr}}

 .nav a{display:block;padding:13px 15px;border-radius:13px;font-weight:650}.nav a.active,.nav a:hover{background:#fff0b2}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse}td,th{padding:10px;border-bottom:1px solid var(--line);text-align:left}.form-grid input,.form-grid textarea,.form-grid select{width:100%}.form-grid label{display:block;margin:12px 0 5px}.flash{padding:10px 16px;background:#fff1ba;border-radius:12px;margin-bottom:12px}.timeline-item{border-left:3px solid #ffda5d;padding:5px 18px;margin:15px 0}.chart-bar{min-height:3px}.chart-label{font-size:10px}.stack{display:grid;gap:14px}.muted{color:var(--muted)}.small{font-size:12px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}@media(max-width:850px){.admin-grid{grid-template-columns:1fr}}
.metric-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.dashboard-controls{display:flex;gap:16px;flex-wrap:wrap;align-items:end}.dashboard-controls label{font-size:12px;font-weight:700;display:grid;gap:6px;flex:1;min-width:150px}.dashboard-controls select{border:1px solid #e8d7b2;border-radius:10px;padding:11px;background:#fff}.chart-area{height:285px;display:flex;align-items:stretch;gap:5px;overflow-x:auto;padding:10px 4px 4px}.plot{display:flex;gap:7px;align-items:end;min-width:100%;height:100%;padding:12px 0 26px;border-bottom:1px solid #eadfca}.bar-group{height:100%;flex:1;min-width:18px;display:flex;align-items:end;justify-content:center;position:relative}.bar-group span{position:absolute;bottom:-24px;font-size:10px;color:#8e816f;white-space:nowrap}.bar-group i{display:block;width:65%;max-width:36px;border-radius:6px 6px 0 0;background:linear-gradient(#ffe48c,#e8b536);min-height:2px}.bar-group:nth-child(even) i{background:linear-gradient(#b5d79a,#79ae69)}.split-track{display:flex;height:19px;border-radius:99px;overflow:hidden;background:#f2e7cd;margin:16px 0 8px}.split-track span:first-child{background:#e9b936}.split-track span:last-child{background:#91b97d}.split-caption{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted)}.two-stat{grid-template-columns:repeat(2,minmax(0,1fr))}.data-delta{font-size:12px;color:#826b3b}.data-delta.negative{color:#8c8b86}.metric-grid .stat-value{font-size:clamp(20px,2.2vw,29px)}@media(max-width:1150px){.metric-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.metric-grid{grid-template-columns:repeat(2,1fr)}.two-stat{grid-template-columns:1fr}.chart-area{height:230px}}


/* Haessi motion v1.3: subtle, accessible micro-interactions */
@keyframes haessi-enter{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}
@keyframes haessi-line{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes haessi-dot{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}
@keyframes haessi-flower{0%,100%{transform:rotate(15deg)}50%{transform:rotate(21deg)}}
@media(prefers-reduced-motion:no-preference){
 .hero,.page-title,.page-desc{animation:haessi-enter .55s ease both}
 .card,.record-card,.quick>a,.quick>button,.timeline-item{animation:haessi-enter .55s ease both}
 .grid>.card:nth-child(2),.metric-grid>.card:nth-child(2){animation-delay:.07s}
 .grid>.card:nth-child(3),.metric-grid>.card:nth-child(3){animation-delay:.14s}
 .grid>.card:nth-child(4),.metric-grid>.card:nth-child(4){animation-delay:.21s}
 .grid>.card:nth-child(5),.metric-grid>.card:nth-child(5){animation-delay:.28s}
 .card,.quick a,.quick button,.nav button,.nav a,.btn,.top a,.links a{transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease}
 .card:hover,.quick a:hover,.quick button:hover,.links a:hover{transform:translateY(-3px);box-shadow:0 11px 24px #9a7e4220}
 .nav button:hover,.nav a:hover,.btn:hover,.top a:hover{transform:translateY(-1px)}
 .btn:active,.nav button:active,.quick button:active{transform:scale(.98)}
 .hero:after{animation:haessi-flower 6s ease-in-out infinite}
 #data-chart svg polyline{stroke-dasharray:1;stroke-dashoffset:1;animation:haessi-line 1.05s ease-out forwards}
 #data-chart svg circle{transform-box:fill-box;transform-origin:center;animation:haessi-dot .35s ease-out both;animation-delay:.65s}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}#data-chart svg polyline{stroke-dashoffset:0!important}}


/* v1.5: mobile readability and navigation feedback */
html{scroll-behavior:smooth}
.chart-area{scrollbar-width:thin;scrollbar-color:#d9ba65 #fff8e7;overscroll-behavior-x:contain}
.chart-area svg{flex-shrink:0}
.chart-area svg circle{cursor:crosshair;transition:r .18s ease,fill .18s ease}
.chart-area svg circle:hover{r:7;fill:#ffdb62}
.dashboard-controls select{min-height:44px}
.nav a,.nav button{transition:background-color .2s ease,transform .2s ease}
@media(max-width:760px){
 .side{position:sticky;top:0;z-index:20;background:#fffefaee;backdrop-filter:blur(12px);box-shadow:0 3px 12px #493b2d10}
 .nav{scroll-snap-type:x proximity;scrollbar-width:thin}
 .nav a,.nav button{scroll-snap-align:start;flex:0 0 auto;min-height:42px}
 .top{padding:0 12px}
 .dashboard-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .dashboard-controls label{min-width:0}
 .dashboard-controls label:first-child{grid-column:1/-1}
 .metric-grid .card{padding:14px}
 .metric-grid .stat-value{font-size:clamp(20px,6vw,27px);overflow-wrap:anywhere}
 .chart-area{height:250px;-webkit-overflow-scrolling:touch}
 .table-scroll{border-radius:10px}
 .table-scroll th,.table-scroll td{white-space:nowrap}
 .hero{min-height:200px}
 .hero:after{opacity:.35}
}
@media(max-width:390px){.dashboard-controls{grid-template-columns:1fr}.dashboard-controls label:first-child{grid-column:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.chart-area svg circle{transition:none}}

@media(min-width:761px){.mobile-chart-hint{display:none}}.mobile-chart-hint{font-size:12px;color:#897e6e;margin:6px 0 0}
.stack label{display:grid;gap:7px;font-size:13px}.stack input,.stack textarea,.stack select,#filter{width:100%;border:1px solid #e4d8be;border-radius:10px;padding:11px;background:white;color:var(--ink)}.stack textarea{min-height:105px;resize:vertical}.hidden{display:none!important}#status{min-height:24px}#preview{margin:14px 0}hr{border:0;border-top:1px solid var(--line);margin:24px 0}button:disabled{opacity:.6;cursor:wait}.record-grid p{white-space:pre-wrap}#filter{margin-bottom:20px}.archive-record{overflow-wrap:anywhere}.admin-grid{align-items:start}
.archive-controls{display:grid;grid-template-columns:minmax(200px,1fr) 140px 120px auto;gap:14px;align-items:end;margin:20px 0 14px}.archive-controls label{display:grid;gap:7px;font-size:13px;font-weight:650}.archive-controls input,.archive-controls select{width:100%;min-height:44px;border:1px solid #e4d8be;border-radius:10px;padding:10px;background:#fff;color:var(--ink)}.archive-controls #filter{margin:0}.archive-record[hidden],#archive-empty[hidden]{display:none!important}#archive-results .archive-record{content-visibility:auto;contain-intrinsic-size:auto 190px}.archive-record h3{line-height:1.6}.archive-record .date{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px}@media(max-width:760px){.archive-controls{grid-template-columns:1fr 1fr}.archive-controls label:first-child{grid-column:1/-1}.archive-controls button{grid-column:1/-1}}
.archive-categories{margin-top:20px}.archive-categories h2{font-size:17px;margin:0 0 15px}.archive-group-list{display:flex;flex-wrap:wrap;gap:8px}.archive-group{display:inline-flex;align-items:center;gap:9px;min-height:40px;padding:8px 13px;background:#fff;border:1px solid var(--line);border-radius:12px;color:var(--ink);font-size:13px}.archive-group span{font-size:11px;color:var(--muted)}.archive-group:hover{background:#fff7dc}.archive-group.active{background:#fff0b2;border-color:#d8af43;font-weight:750}.archive-categories details{border-top:1px solid var(--line);margin-top:18px;padding-top:15px}.archive-categories summary{cursor:pointer;font-size:14px;font-weight:700;padding:3px 0 12px}.archive-categories summary span{font-size:12px;color:var(--muted);margin-left:8px}.archive-categories>.small{line-height:1.7;margin:15px 0 0}.archive-badges{display:flex;flex-wrap:wrap;gap:5px}.archive-games{font-size:12px;color:var(--muted);line-height:1.6}.archive-record h3{margin:10px 0}.archive-record .pill{font-size:10px}@media(max-width:760px){.archive-group{font-size:12px;padding:8px 10px}.archive-categories{padding:15px}}
