*,*::before,*::after{box-sizing:border-box}
html{font-size:17px;background:var(--bg);color:var(--text);font-family:var(--font-body);line-height:1.5;-webkit-font-smoothing:antialiased}
body{margin:0;padding:0;min-height:100vh;background-image:radial-gradient(ellipse at 88% 6%,rgba(187,65,39,.09) 0 42px,transparent 44px),radial-gradient(circle at 12% 92%,rgba(217,153,43,.12) 0 60px,transparent 64px),radial-gradient(circle at 92% 82%,rgba(187,65,39,.06) 0 28px,transparent 30px)}
.skip-link{position:absolute;top:-100px;left:var(--s-4);background:var(--text);color:var(--paper-raised);padding:var(--s-2) var(--s-4);z-index:100;border-radius:var(--r-sm);transition:top var(--dur-fast) ease}
.skip-link:focus-visible{top:var(--s-4)}
.page{max-width:1040px;margin:0 auto;padding:var(--s-6) var(--s-4) var(--s-7)}
h1,h2,h3,.masthead__kicker{font-family:var(--font-hand);font-weight:700;margin:0;line-height:1.15}
.masthead{text-align:center;padding-bottom:var(--s-5);border-bottom:2px dashed var(--border)}
.masthead__kicker{font-size:var(--fs-lg);color:var(--sauce);letter-spacing:.05em;transform:rotate(-1.5deg);display:inline-block}
.masthead__title{font-size:var(--fs-2xl);color:var(--ink);margin-top:var(--s-1)}
.masthead__sub{max-width:540px;margin:var(--s-2) auto 0;color:var(--text-muted);font-size:var(--fs-lg)}
.tally{display:flex;justify-content:center;gap:var(--s-5);margin:var(--s-4) 0 0;font-size:var(--fs-base)}
.tally div{background:var(--paper-sunk);padding:var(--s-2) var(--s-4);border-radius:var(--r-pill);border:1px solid var(--border)}
.tally dt{display:inline;color:var(--text-muted)}.tally dd{display:inline;font-weight:bold;margin-left:var(--s-1);font-size:var(--fs-lg)}
.alerts{margin:var(--s-4) 0}
.alert{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding:var(--s-3) var(--s-4);border-radius:var(--r-md);border:1px solid;margin-bottom:var(--s-2);font-size:var(--fs-base);animation:slide-in var(--dur) var(--ease)}
.alert--error{background:#fdf0ed;border-color:#e59787;color:var(--danger)}
.alert--warn{background:#fdf8eb;border-color:#ebd18e;color:#7d5912}
.alert--info{background:var(--paper-sunk);border-color:var(--border-strong);color:var(--ink)}
.alert__btn{background:transparent;border:none;font:inherit;font-size:var(--fs-lg);cursor:pointer;color:inherit;padding:0 var(--s-2)}
.toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-5)}
.toolbar__hint{margin:0;color:var(--text-muted);font-size:var(--fs-sm)}
kbd{background:var(--paper-sunk);border:1px solid var(--border-strong);border-radius:var(--r-sm);padding:0 4px;font-size:.8em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);font-family:var(--font-hand);font-weight:700;font-size:var(--fs-lg);padding:var(--s-2) var(--s-5);border-radius:var(--r-pill);border:2px solid transparent;cursor:pointer;background:transparent;color:var(--text);transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.btn:active{transform:translateY(1px)}.btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.btn--primary{background:var(--sauce);color:#fff;box-shadow:0 2px 4px rgba(187,65,39,.35)}
.btn--primary:hover{background:var(--sauce-deep);box-shadow:0 4px 8px rgba(187,65,39,.4);transform:translateY(-1px)}
.btn--ghost{border-color:var(--border);color:var(--ink-soft)}
.btn--ghost:hover{background:var(--paper-sunk);color:var(--ink)}
.btn--sm{font-size:var(--fs-base);padding:var(--s-1) var(--s-3);border-radius:var(--r-sm)}
.btn--danger{background:var(--danger);color:#fff}.btn--danger:hover{background:#772111}
.panel{background:var(--surface);border:2px solid var(--border-strong);border-radius:var(--r-md);padding:var(--s-5);margin-top:var(--s-4);box-shadow:var(--shadow-lift);animation:pop-down var(--dur) var(--ease-back)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4)}
.form__title{grid-column:1 / -1;font-size:var(--fs-xl);color:var(--sauce);border-bottom:1px dashed var(--border);padding-bottom:var(--s-2)}
.field{display:flex;flex-direction:column;gap:var(--s-1)}.field--wide{grid-column:1 / -1}
.form__actions{display:flex;gap:var(--s-3);margin-top:var(--s-2)}
label{font-weight:bold;font-size:var(--fs-base);color:var(--ink)}.req{color:var(--sauce)}
input[type="text"],textarea,select{font-family:inherit;font-size:var(--fs-base);padding:var(--s-2) var(--s-3);border:1.5px solid var(--border-strong);border-radius:var(--r-sm);background:var(--paper-raised);color:var(--ink);transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
input[type="text"]:focus-visible,textarea:focus-visible,select:focus-visible{outline:none;border-color:var(--sauce);box-shadow:0 0 0 3px rgba(187,65,39,.2)}
.field__error{min-height:1.2em;margin:var(--s-1) 0 0;font-size:var(--fs-sm);color:var(--danger)}
.controls{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-4);background:var(--paper-sunk);padding:var(--s-3) var(--s-4);border-radius:var(--r-md);border:1px solid var(--border);margin:var(--s-5) 0 var(--s-4)}
.field--inline{display:flex;align-items:center;gap:var(--s-2);margin:0}
.segmented{border:none;padding:0}.segmented legend{font-weight:bold;font-size:var(--fs-base);margin-right:var(--s-2);float:left}
.segmented__row{display:inline-flex;background:var(--paper-raised);border:1.5px solid var(--border-strong);border-radius:var(--r-pill);padding:2px;gap:2px}
.segmented__btn{font-family:inherit;font-size:var(--fs-base);border:none;background:transparent;padding:var(--s-1) var(--s-3);border-radius:var(--r-pill);cursor:pointer;color:var(--ink-soft);transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.segmented__btn:hover{color:var(--ink)}
.segmented__btn[aria-checked="true"]{background:var(--sauce);color:#fff;font-weight:bold}
.segmented__btn:focus-visible{outline:3px solid var(--focus);outline-offset:1px}
.list{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:var(--s-5);margin-top:var(--s-4)}
.card{position:relative;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--r-md);padding:var(--s-4) var(--s-4) var(--s-3);display:flex;flex-direction:column;box-shadow:var(--shadow-card);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);animation:card-enter var(--dur-slow) var(--ease) backwards;animation-delay:calc(var(--i, 0) * 45ms);overflow:hidden}
.card:hover{transform:translateY(-3px) rotate(calc(var(--tilt, 0) * .4deg));box-shadow:var(--shadow-lift)}
.card__dogear{position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 28px 28px 0;border-color:transparent var(--paper-edge) transparent transparent;pointer-events:none;filter:drop-shadow(-1px 1px 1px rgba(0,0,0,.15))}
.card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-2);margin-bottom:var(--s-2)}
.card__name{font-size:var(--fs-xl);color:var(--ink);word-break:break-word;transition:color var(--dur) var(--ease)}
.card__cuisine{font-family:var(--font-hand);font-size:var(--fs-base);font-weight:700;background:var(--paper-sunk);color:var(--plum);border:1px dashed var(--border-strong);padding:2px var(--s-2);border-radius:var(--r-sm);white-space:nowrap;align-self:flex-start}
.card__place{margin:0 0 var(--s-2);font-size:var(--fs-base);color:var(--ink-soft)}
.card__restaurant{font-weight:bold;color:var(--ink)}
.card__why{margin:0 0 var(--s-2);font-size:var(--fs-base);color:var(--ink);font-style:italic;flex:1}
.card__source{margin:0 0 var(--s-3);font-size:var(--fs-sm);color:var(--ink-faint);display:flex;align-items:center;gap:var(--s-1)}
.card__source::before{content:"✎";color:var(--mustard)}
.card__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);border-top:1px dashed var(--border);padding-top:var(--s-2);margin-top:auto}
.card__date{font-size:var(--fs-sm);color:var(--ink-faint)}
.card[data-tried="true"]{background:#f9f5ed;border-color:var(--border)}
.card[data-tried="true"] .card__name{text-decoration:line-through;text-decoration-color:var(--sauce);text-decoration-thickness:2.5px;color:var(--ink-soft)}
.card[data-tried="true"] .card__why,.card[data-tried="true"] .card__place{opacity:.72}
.stamp{position:absolute;top:40%;right:12%;transform:translate(0,-50%) rotate(-12deg) scale(.9);border:3px double var(--sauce);color:var(--sauce);font-family:var(--font-hand);font-weight:700;font-size:1.8rem;letter-spacing:.15em;padding:var(--s-1) var(--s-4);border-radius:var(--r-sm);pointer-events:none;opacity:0;transition:opacity var(--dur) var(--ease),transform var(--dur-slow) var(--ease-back);mask-image:radial-gradient(circle,rgba(0,0,0,1) 70%,rgba(0,0,0,.6) 100%)}
.card[data-tried="true"] .stamp{opacity:.88;transform:translate(0,-50%) rotate(-14deg) scale(1)}
.card__confirm{position:absolute;inset:0;background:rgba(255,250,240,.96);padding:var(--s-4);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s-3);text-align:center;animation:fade-in var(--dur-fast) var(--ease);z-index:5}
.card__confirm p{margin:0;font-weight:bold}
.card__confirm-actions{display:flex;gap:var(--s-2)}
.empty{grid-column:1 / -1;text-align:center;background:var(--surface);border:2px dashed var(--border-strong);border-radius:var(--r-md);padding:var(--s-7) var(--s-4);animation:fade-in var(--dur) var(--ease)}
.empty__icon{font-size:3rem;line-height:1;margin-bottom:var(--s-2);display:block}
.empty__title{font-size:var(--fs-xl);color:var(--sauce);margin-bottom:var(--s-2)}
.empty__text{max-width:420px;margin:0 auto var(--s-4);color:var(--text-muted)}
.load-grid{grid-column:1 / -1;display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:var(--s-5)}
.skeleton{height:220px;background:linear-gradient(90deg,var(--paper-sunk) 25%,var(--paper-raised) 50%,var(--paper-sunk) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--r-md);border:1px solid var(--border)}
.footer{text-align:center;margin-top:var(--s-7);padding-top:var(--s-4);border-top:1px dashed var(--border);color:var(--ink-faint);font-size:var(--fs-sm)}
@keyframes card-enter{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes pop-down{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes slide-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@keyframes fade-in{from{opacity:0}to{opacity:1}}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media (max-width:640px){.form{grid-template-columns:1fr}.controls{flex-direction:column;align-items:stretch}.field--inline{justify-content:space-between}.segmented legend{float:none;margin-bottom:var(--s-1)}.segmented__row{width:100%;display:flex}.segmented__btn{flex:1}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}