:root{--paper:#f8f0dd;--paper-deep:#f0e4c8;--card:#fffdf4;--ink:#4a3b32;--ink-soft:#94816f;--line:#e2d4b8;--kaki:#ec7357;--kaki-deep:#d95f43;--kaki-soft:#fbe4dc;--matcha:#8fa65c;--matcha-deep:#74893f;--matcha-soft:#e9efd8;--tamago:#f2c94c;--tamago-deep:#cc9f18;--tamago-soft:#fcf0cb;--azuki:#b4525e;--mizu:#7fb5c8;--shadow:0 3px 0 #4a3b3224;--radius:18px}*{box-sizing:border-box}html,body{color:var(--ink);background-color:var(--paper);-webkit-font-smoothing:antialiased;background-image:radial-gradient(#4a3b320e 1px,#0000 1.4px);background-size:22px 22px;margin:0;padding:0;font-family:Zen Maru Gothic,Hiragino Maru Gothic ProN,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}button{color:inherit;cursor:pointer;font-family:inherit}input,textarea,select{color:inherit;font-family:inherit}.container{max-width:860px;margin:0 auto;padding:0 16px 72px}.site-header{justify-content:space-between;align-items:center;gap:12px;padding:18px 4px 10px;display:flex}.site-brand{align-items:center;gap:10px;display:flex}.site-title{letter-spacing:2px;font-size:26px;font-weight:700;line-height:1.1}.site-sub{color:var(--ink-soft);letter-spacing:3px;margin-top:2px;font-size:11px}.site-nav{gap:8px;display:flex}.btn{border:2px solid var(--ink);background:var(--card);box-shadow:var(--shadow);white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;gap:6px;padding:7px 16px;font-size:14px;font-weight:700;transition:transform .12s,box-shadow .12s;display:inline-flex}.btn:hover{transform:translateY(-2px)rotate(-1deg);box-shadow:0 5px #4a3b3224}.btn:active{transform:translateY(1px);box-shadow:0 1px #4a3b3224}.btn.primary{background:var(--kaki);color:#fff}.btn.matcha{background:var(--matcha);color:#fff}.btn.ghost{box-shadow:none;background:0 0;border-style:dashed}.btn.danger{background:var(--azuki);color:#fff}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn.small{border-width:1.6px;padding:4px 12px;font-size:12.5px}.cat-tabs{flex-wrap:wrap;gap:10px;margin:18px 0 22px;display:flex}.cat-tab{border:2px solid var(--ink);background:var(--card);text-align:center;box-shadow:var(--shadow);border-radius:14px;padding:8px 18px 6px;transition:transform .12s;position:relative}.cat-tab:hover{transform:translateY(-2px)rotate(1deg)}.cat-tab .zh{font-size:16px;font-weight:700;line-height:1.2;display:block}.cat-tab .jp{color:var(--ink-soft);letter-spacing:1px;font-size:10px}.cat-tab.active{background:var(--ink);color:var(--card)}.cat-tab.active .jp{color:#fffdf4b3}.cat-tab.active:after{content:"";background:var(--ink);width:8px;height:8px;position:absolute;bottom:-7px;left:50%;transform:translate(-50%)rotate(45deg)}.owner-chips{flex-wrap:wrap;gap:8px;margin:-8px 0 18px;display:flex}.owner-chip{border:1.6px dashed var(--ink);color:var(--ink-soft);background:0 0;border-radius:999px;padding:4px 14px;font-size:12.5px;font-weight:700}.owner-chip.active{background:var(--kaki);color:#fff;border-style:solid;border-color:var(--ink)}.badge.owner{background:var(--tamago-soft)}.owner-select{border:1.6px dashed var(--ink);color:var(--ink-soft);background:0 0;border-radius:999px;max-width:180px;padding:4px 12px;font-size:12.5px;font-weight:700}.owner-select.active{background:var(--kaki);color:#fff;border-style:solid;border-color:var(--ink)}.recipe-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;display:grid}.recipe-card{background:var(--card);border:2px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;transition:transform .15s,box-shadow .15s;animation:.45s backwards card-in;display:flex;overflow:hidden}.recipe-card:nth-child(3n+2){transform:rotate(.5deg)}.recipe-card:nth-child(3n){transform:rotate(-.5deg)}.recipe-card:hover{transform:translateY(-4px)rotate(0);box-shadow:0 7px #4a3b3224}@keyframes card-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1}}.recipe-cover{aspect-ratio:4/3;background:var(--tamago-soft);border-bottom:2px solid var(--ink);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.recipe-cover img{object-fit:cover;width:100%;height:100%}.recipe-card-body{flex:1;padding:12px 14px 14px}.recipe-card-title{font-size:17px;font-weight:700;line-height:1.35}.recipe-card-intro{color:var(--ink-soft);margin-top:3px;font-size:12.5px}.recipe-card-meta{flex-wrap:wrap;gap:6px;margin-top:9px;display:flex}.badge{border:1.6px solid var(--ink);background:var(--card);border-radius:999px;align-items:center;gap:4px;padding:1px 9px;font-size:11px;font-weight:700;display:inline-flex}.badge.staple{background:var(--tamago-soft)}.badge.meat{background:var(--kaki-soft)}.badge.veggie{background:var(--matcha-soft)}.badge.draft{background:var(--ink);color:var(--card);border-style:dashed;border-color:var(--card)}.empty-note{text-align:center;color:var(--ink-soft);padding:60px 0;font-size:15px}.recipe-hero{background:var(--card);border:2px solid var(--ink);box-shadow:var(--shadow);border-radius:22px;align-items:center;gap:20px;margin-top:14px;padding:18px;display:flex}.recipe-hero-cover{border:2px solid var(--ink);background:var(--tamago-soft);border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:168px;height:168px;display:flex;overflow:hidden;transform:rotate(-2deg)}.recipe-hero-cover img{object-fit:cover;width:100%;height:100%}.recipe-hero h1{margin:0 0 4px;font-size:26px;line-height:1.3}.recipe-hero .intro{color:var(--ink-soft);margin:0 0 10px;font-size:14px}.section{margin-top:30px;animation:.5s backwards card-in}.section-tape{background:var(--tamago);border:2px solid var(--ink);box-shadow:var(--shadow);z-index:1;border-radius:4px;align-items:center;gap:8px;padding:5px 18px;font-size:16px;font-weight:700;display:inline-flex;position:relative;transform:rotate(-1.2deg)}.section-tape.matcha{background:var(--matcha-soft);transform:rotate(.8deg)}.section-tape.kaki{background:var(--kaki-soft);transform:rotate(-.6deg)}.section-tape.mizu{background:#ddedf3;transform:rotate(1deg)}.section-tape .jp{color:var(--ink-soft);letter-spacing:1px;font-size:10px;font-weight:400}.section-body{background:var(--card);border:2px dashed var(--ink);border-radius:var(--radius);margin-top:-8px;padding:18px 18px 16px}.ing-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.ing-chip{border:1.6px solid var(--line);background:var(--paper);border-radius:12px;align-items:center;gap:8px;padding:7px 10px;display:flex}.ing-chip .name{font-size:13.5px;font-weight:700;line-height:1.3}.ing-chip .amount{color:var(--ink-soft);font-size:11.5px}.step-list{flex-direction:column;gap:4px;display:flex}.step-item{align-items:flex-start;gap:12px;padding:9px 4px;display:flex}.step-item+.step-item{border-top:1.6px dashed var(--line)}.step-no{border:2px solid var(--ink);background:var(--card);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:26px;height:26px;margin-top:6px;font-size:13px;font-weight:700;display:flex;transform:rotate(-4deg)}.step-icon-box{border:1.6px solid var(--line);background:var(--paper);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:46px;height:46px;display:flex}.step-text{padding-top:8px;font-size:14.5px}.tip-item{align-items:flex-start;gap:10px;padding:7px 0;font-size:14px;display:flex}.tip-item .mark{color:var(--azuki);flex-shrink:0;font-weight:700}.panel{background:var(--card);border:2px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);margin-top:18px;padding:20px}.field{margin-bottom:14px}.field label{margin-bottom:5px;font-size:13px;font-weight:700;display:block}.input,.textarea,.select{border:2px solid var(--ink);background:var(--paper);border-radius:12px;outline:none;width:100%;padding:9px 12px;font-size:14.5px}.input:focus,.textarea:focus{border-color:var(--kaki);background:#fff}.textarea{resize:vertical;min-height:130px;line-height:1.7}.mode-tabs{flex-wrap:wrap;gap:8px;margin-bottom:16px;display:flex}.mode-tab{border:2px solid var(--ink);background:var(--paper);border-radius:999px;padding:6px 16px;font-size:13.5px;font-weight:700}.mode-tab.active{background:var(--ink);color:var(--card)}.hint{color:var(--ink-soft);margin-top:6px;font-size:12.5px}.error-note{border:2px solid var(--azuki);color:var(--azuki);background:#f9e6e8;border-radius:12px;margin:12px 0;padding:10px 14px;font-size:13.5px}.job-log{flex-direction:column;gap:8px;margin-top:14px;display:flex}.job-line{align-items:center;gap:10px;font-size:14px;display:flex}.job-line .dot{border:2px solid var(--ink);background:var(--matcha);border-radius:50%;flex-shrink:0;width:10px;height:10px}.job-line.current .dot{background:var(--tamago);animation:1s infinite blink}@keyframes blink{50%{opacity:.35}}.cooking-anim{justify-content:center;padding:8px 0 2px;animation:1.6s ease-in-out infinite bob;display:flex}@keyframes bob{50%{transform:translateY(-6px)}}.edit-row{align-items:flex-start;gap:8px;margin-bottom:8px;display:flex}.edit-row .grow{flex:1}.icon-btn{border:2px solid var(--ink);background:var(--paper);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:46px;height:46px;padding:0;display:flex}.icon-pop{z-index:30;background:var(--card);border:2px solid var(--ink);border-radius:14px;grid-template-columns:repeat(8,40px);gap:4px;max-height:300px;padding:10px;display:grid;position:absolute;overflow-y:auto;box-shadow:0 6px #4a3b3224}.icon-pop button{background:0 0;border:1.6px solid #0000;border-radius:10px;padding:2px}.icon-pop button:hover{border-color:var(--ink);background:var(--paper)}.row-actions{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.mic-btn.recording{background:var(--azuki);color:#fff;animation:1.2s infinite blink}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;display:grid}.photo-card{background:var(--card);border:2px solid var(--ink);box-shadow:var(--shadow);border-radius:14px;margin:0;overflow:hidden}.photo-grid .photo-card:nth-child(2n){transform:rotate(.8deg)}.photo-grid .photo-card:nth-child(3n){transform:rotate(-.8deg)}.photo-card img{aspect-ratio:1;object-fit:cover;border-bottom:2px solid var(--ink);width:100%;display:block}.photo-card figcaption{flex-wrap:wrap;align-items:center;gap:6px;padding:8px 10px;font-size:12px;display:flex}.photo-caption{color:var(--ink-soft);flex:1;min-width:60%}.site-footer{text-align:center;color:var(--ink-soft);letter-spacing:1px;padding:30px 0 10px;font-size:12px}@media (max-width:560px){.site-title{font-size:21px}.recipe-grid{grid-template-columns:repeat(2,1fr);gap:12px}.recipe-card-title{font-size:15px}.recipe-hero{text-align:center;flex-direction:column}.recipe-hero-cover{width:150px;height:150px}.ing-grid{grid-template-columns:repeat(2,1fr)}.icon-pop{grid-template-columns:repeat(6,40px)}.step-text{font-size:14px}}
