
  :root {
    --paper:#f8f3e9; --cream:#fffaf0; --blush:#f6e4dc; --ink:#39362f;
    --muted:#777369; --burgundy:#96574d; --deep:#683a34; --olive:#586650;
    --border:#ded3c2; --shadow:0 9px 25px rgba(58,43,29,.09);
    --radius:17px;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0;color:var(--ink);background:var(--paper);font:15px/1.52 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
  body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(#a38a6b20 .7px,transparent .7px);background-size:6px 6px;opacity:.75}
  button,input,select,textarea{font:inherit}
  button{cursor:pointer} button:disabled{cursor:not-allowed;opacity:.55}
  :focus-visible{outline:3px solid #b76a5c;outline-offset:3px}
  [hidden]{display:none!important}
  .container{max-width:1210px;margin:0 auto;padding:0 25px}
  .serif{font-family:Georgia,"Times New Roman",serif}
  .eyebrow{font-size:11px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--burgundy)}
  header{position:relative;overflow:hidden;background:linear-gradient(130deg,#faf3e7 5%,#f4e3d8 72%,#edddd1);border-bottom:1px solid var(--border)}
  header::after{content:"PAR AVION · POSTCROSSING · AIR MAIL · PAR AVION · POSTCROSSING · AIR MAIL";display:block;max-height:23px;overflow:hidden;text-align:center;background:repeating-linear-gradient(110deg, #d8a599 0px,#d8a599 19px,#fcf5ea 19px,#fcf5ea 38px,#879b91 38px,#879b91 57px,#fcf5ea 57px,#fcf5ea 76px);border-top:4px solid #fcf5ea;font-size:9px;font-weight:bold;color:#4b3b32;letter-spacing:3px;line-height:18px;opacity:.58}
  .topline{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0 4px}
  .brand-small{display:flex;align-items:center;gap:10px;color:var(--deep);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
  .brand-mark{width:38px;height:38px;border:1.5px dashed var(--burgundy);border-radius:9px;display:grid;place-items:center;font-size:23px;transform:rotate(-7deg);background:#fff8f0aa}
  .top-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid var(--border);border-radius:11px;padding:10px 15px;background:#fffbf5;color:var(--ink);font-weight:650;text-decoration:none;min-height:42px;transition:background .2s,transform .2s}
  .btn:hover{background:#f9e9de;transform:translateY(-1px)}
  .btn-primary{color:white;background:var(--deep);border-color:var(--deep);box-shadow:0 3px 0 #452b23}
  .btn-primary:hover{background:#824e42}
  .btn-quiet{background:transparent}
  .btn-small{font-size:13px;min-height:35px;padding:7px 10px;border-radius:8px}
  .btn-danger{color:#933c37;border-color:#d8aba4;background:#fff7f3}
  .hero{display:grid;grid-template-columns:minmax(0,1fr) 225px;gap:10px;align-items:center;min-height:243px;padding:18px 0 32px}
  h1{font:normal clamp(40px,6vw,68px)/1.06 Georgia,"Times New Roman",serif;letter-spacing:-.047em;margin:8px 0 13px;color:var(--deep)}
  .hero p{margin:0;color:#71665f;max-width:520px;font-size:16px}
  .hero-art{width:210px;height:176px;position:relative;justify-self:center;transform:rotate(7deg)}
  .hero-art .envelope{position:absolute;inset:28px 12px 2px;background:#fff8eb;border:2px solid #b9a28e;border-radius:5px;box-shadow:8px 12px 20px #6f4a3b26}
  .hero-art .envelope::before{content:"";position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 60%);background:#e8d6c1;border-bottom:2px solid #b9a28e}
  .hero-art .stamp{position:absolute;right:8px;top:12px;display:grid;place-items:center;width:66px;height:79px;border:6px dotted #fff0e3;outline:1px solid #b27e70;background:#be776a;color:#fff8e8;text-align:center;font:12px Georgia,serif;transform:rotate(-10deg);box-shadow:2px 4px 8px #0002}
  .hero-art .stamp strong{font-size:25px;line-height:1}
  .hero-art .postmark{position:absolute;left:-7px;bottom:36px;border:3px double #9f6a5d;color:#9f6a5d;width:84px;height:84px;border-radius:50%;display:grid;place-items:center;text-align:center;font:10px/1.5 Georgia,serif;transform:rotate(-19deg);opacity:.73}
  main{padding:25px 0 70px}
  main.container{padding-top:25px;padding-bottom:70px}
  .notice{background:#fff9f0;border:1px solid #d6bca4;border-radius:12px;padding:12px 15px;margin-bottom:18px;color:#694b36;display:flex;gap:10px;align-items:center}
  .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:27px}
  .stat{background:#fffaf4;border:1px solid var(--border);border-radius:14px;padding:16px 18px;position:relative;overflow:hidden;box-shadow:0 3px 8px #5e47330c}
  .stat::after{content:"✧";position:absolute;right:14px;top:7px;color:#dfc8bb;font-size:22px}
  .stat .n{font:normal 37px/1.15 Georgia,serif;color:var(--deep)}
  .stat .lab{font-size:12px;color:var(--muted);margin-top:5px}
  .section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin:24px 0 17px}
  h2{font:normal 30px/1.2 Georgia,serif;letter-spacing:-.025em;margin:0;color:var(--deep)}
  .hint{font-size:13px;color:var(--muted)}
  .tabs{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
  .tab{background:transparent;color:#756b60;border:1px solid transparent;padding:9px 13px;border-radius:9px;font-weight:680}
  .tab.active{background:#fffaf4;border-color:var(--border);color:var(--deep);box-shadow:0 3px 7px #4434220a}
  .tools{display:grid;grid-template-columns:minmax(180px,1fr) auto auto auto;gap:9px;margin:16px 0 20px}
  .field{width:100%;min-height:42px;border:1px solid #d8ccbb;border-radius:9px;padding:10px 12px;background:#fffbf6;color:var(--ink);outline-color:#a15e53}
  input.field,select.field{min-width:0}
  .chip-row{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 16px}
  .chip{border:1px solid #dfd0c0;color:#705e56;background:#fffaf3;border-radius:30px;padding:7px 12px;font-size:12px;font-weight:700}
  .chip.selected{color:white;background:var(--deep);border-color:var(--deep)}
  .gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:21px}
  .postcard-card{position:relative;border:1px solid #d9cbbb;border-radius:15px;background:#fffaf3;box-shadow:var(--shadow);overflow:hidden;transition:transform .2s,box-shadow .2s;min-width:0}
  .postcard-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px #513e2b1f}
  .postcard-photo{height:211px;overflow:hidden;position:relative;background:#eaded0;display:grid;place-items:center;border-bottom:1px solid #e3d4c4;cursor:pointer}
  .postcard-photo img{width:100%;height:100%;object-fit:cover;display:block}
  .photo-fallback{width:85%;height:79%;position:relative;border:7px solid #fff8ea;box-shadow:0 3px 12px #3b291f18;background:linear-gradient(135deg,#ead0c5,#d2d5bc 75%);display:grid;place-items:center;text-align:center;color:#7a6654;transform:rotate(-4deg)}
  .photo-fallback::after{content:"✉";font-size:64px;font-family:Georgia,serif;color:#f9f0e3;position:absolute;top:5px}
  .photo-fallback span{font:italic 13px Georgia,serif;align-self:end;margin-bottom:9px;z-index:1}
  .card-fav{position:absolute;right:12px;top:11px;z-index:2;border:1px solid #e0d0bb;border-radius:50%;width:39px;height:39px;background:#fff9edee;color:#9f5e55;font-size:21px;display:grid;place-items:center}
  .card-fav[aria-pressed="true"]{background:#f5d6d1;color:#8b433d}
  .card-info{padding:16px 17px 17px;cursor:pointer}
  .card-top{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
  .country-title{font:normal 24px Georgia,serif;color:#4d4038;line-height:1.17;margin:10px 0 7px;overflow-wrap:anywhere}
  .card-code{font-size:12px;color:#8c7d70;letter-spacing:.06em}
  .meta{font-size:13px;color:var(--muted);margin-top:9px;display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}
  .status{border-radius:30px;padding:4px 9px;font-size:11px;font-weight:750;background:#f7e8d1;color:#90612e;white-space:nowrap}
  .status.received{background:#e1ebdb;color:#4e7045}
  .tagline{font-size:13px;color:#777066;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:11px;border-top:1px solid #eee2d5;padding-top:10px}
  .empty{border:1px dashed #d8bdad;background:#fffaf3;border-radius:18px;padding:45px 20px;text-align:center;color:#766a60}
  .empty-art{margin:auto;display:grid;place-items:center;width:140px;height:100px;background:#f3dfd3;border:10px solid #fff7e9;transform:rotate(-5deg);box-shadow:3px 5px 12px #0001;font-size:50px;color:#956352}
  .empty h3{font:normal 27px Georgia,serif;color:var(--deep);margin:22px 0 7px}
  .empty p{max-width:450px;margin:0 auto 20px;font-size:14px}
  .country-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
  .country-box{min-width:0;text-align:left;background:#fffaf3;border:1px solid var(--border);border-radius:13px;padding:17px;display:flex;align-items:center;gap:13px;box-shadow:0 3px 8px #00000008}
  .country-box:hover{background:#f8eadd}
  .bigflag{font-size:35px;line-height:1}
  .country-box strong{display:block;font:normal 22px Georgia,serif;overflow-wrap:anywhere}
  .country-box small{color:var(--muted)}
  .timeline-head{font:normal 27px Georgia,serif;color:var(--deep);border-bottom:1px solid #d8c7b6;padding-bottom:9px;margin:22px 0 13px}
  .timeline-list{display:flex;flex-direction:column;gap:9px}
  .timeline-row{width:100%;text-align:left;background:#fffaf5;border:1px solid var(--border);border-radius:11px;padding:12px;display:flex;align-items:center;gap:14px}
  .timeline-row:hover{background:#f8ece0}
  .mini-thumb{width:66px;height:54px;flex:none;object-fit:cover;background:#e5d7c9;border-radius:6px;display:grid;place-items:center;font-size:25px;overflow:hidden}
  .timeline-row strong{font:normal 19px Georgia,serif;display:block}
  .timeline-row small{color:var(--muted)}
  .footer{margin-top:46px;border-top:1px solid var(--border);padding-top:22px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:#8c7b6a;font-size:12px}
  dialog{border:1px solid #cdb8a4;border-radius:19px;padding:0;max-height:92dvh;color:var(--ink);background:#fffaf2;box-shadow:0 25px 80px #231b1780}
  dialog::backdrop{background:#30262196;backdrop-filter:blur(3px)}
  .dialog-edit{width:min(760px,calc(100vw - 22px))}
  .dialog-detail{width:min(820px,calc(100vw - 22px))}
  .dialog-inner{max-height:92dvh;overflow:auto}
  .dialog-header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:21px 24px;border-bottom:1px solid #e7d6c4;position:sticky;top:0;z-index:4;background:#fffaf2ed;backdrop-filter:blur(12px)}
  .dialog-header h2{font-size:28px}
  .xbtn{font-size:24px;color:#81695b;background:transparent;border:0;width:36px;height:36px;border-radius:50%}
  .xbtn:hover{background:#f1dfd3}
  .dialog-body{padding:22px 24px 26px}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .span2{grid-column:1/-1}
  label.form-item{display:flex;flex-direction:column;gap:5px;color:#6d574d;font-size:12px;font-weight:750;letter-spacing:.03em}
  .form-item textarea{min-height:78px;resize:vertical}
  .form-item input,.form-item select,.form-item textarea{font-size:14px;font-weight:400;color:var(--ink)}
  .photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .photo-upload{border:1px dashed #d5bca8;background:#fff6ec;border-radius:10px;padding:10px;min-width:0}
  .photo-upload strong{display:block;font-size:13px;color:#6d574d;margin-bottom:7px}
  .photo-upload img{width:100%;height:130px;object-fit:contain;background:#f4e7d9;border-radius:7px;margin-bottom:6px}
  .photo-upload input{width:100%;font-size:12px}
  .muted{color:var(--muted);font-size:12px}
  .checkboxline{display:flex;align-items:center;gap:8px;font-weight:600;color:#6b544b;font-size:14px}
  .dialog-actions{display:flex;gap:9px;justify-content:space-between;flex-wrap:wrap;margin-top:22px;border-top:1px solid #ead8c5;padding-top:17px}
  .rightactions{display:flex;gap:9px;flex-wrap:wrap}
  .detail-photos{display:grid;grid-template-columns:1fr 1fr;gap:11px}
  .detail-image{border:1px solid var(--border);border-radius:10px;background:#f0e2d2;overflow:hidden;min-height:180px;display:flex;flex-direction:column}
  .detail-image img{width:100%;height:220px;object-fit:contain;cursor:zoom-in}
  .detail-image .no-photo{height:220px;display:grid;place-items:center;color:#9b8573;font:italic 15px Georgia,serif}
  .detail-image label{display:block;text-align:center;padding:8px;background:#fff6eb;color:#80695e;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
  .detail-title{font:normal 34px Georgia,serif;color:var(--deep);margin:13px 0 8px}
  .detail-info{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;background:#fbefe4;border:1px solid #e7d6c9;border-radius:12px;padding:16px;margin:16px 0}
  .detail-info dt{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#90786a}
  .detail-info dd{margin:2px 0 0;font-size:14px;font-weight:650;overflow-wrap:anywhere}
  .detail-notes h3{font:normal 20px Georgia,serif;color:var(--deep);margin:16px 0 3px}
  .detail-notes p{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;color:#605750}
  .lightbox{background:#241d19ed;border:0;border-radius:12px;width:min(95vw,1200px);height:min(94dvh,950px)}
  .lightbox .dialog-inner{height:100%;max-height:100%;display:flex;flex-direction:column}
  .lightbox-top{display:flex;justify-content:space-between;align-items:center;padding:7px 15px;color:white}
  .lightbox-top .xbtn{color:white}
  .lightbox img{display:block;max-width:100%;max-height:calc(94dvh - 60px);object-fit:contain;margin:auto}
  #toast{position:fixed;bottom:20px;right:20px;background:#534039;color:#fff9eb;border-radius:11px;padding:12px 16px;z-index:1000;box-shadow:var(--shadow);max-width:min(400px,calc(100vw - 40px));pointer-events:none}
  .menu{position:relative}
  .menu .menu-panel{position:absolute;right:0;top:calc(100% + 6px);background:#fffcf5;border:1px solid var(--border);border-radius:11px;box-shadow:var(--shadow);width:245px;padding:7px;z-index:10}
  .menu .menu-panel button{display:block;text-align:left;background:transparent;border:0;border-radius:7px;padding:10px;width:100%;font-size:13px;color:var(--ink)}
  .menu .menu-panel button:hover{background:#f4e5d9}
  .menu .menu-panel hr{border:0;border-top:1px solid #eadbcc}
  @media(max-width:970px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.country-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:690px){
    .container{padding:0 15px}.topline{padding-top:15px;align-items:flex-start}.brand-small{font-size:10px;letter-spacing:.08em}.brand-mark{height:31px;width:31px;font-size:18px}.top-actions{gap:6px}.top-actions .btn{padding:9px 10px;font-size:12px}.hero{grid-template-columns:1fr;min-height:0;padding:24px 0 30px}.hero-art{display:none}h1{font-size:46px}.hero p{font-size:14px}.stats{grid-template-columns:repeat(2,1fr);gap:9px}.stat{padding:13px}.stat .n{font-size:30px}.section-head{align-items:flex-start;flex-direction:column}.tools{grid-template-columns:1fr 1fr}.tools #search{grid-column:1/-1}.tools #sortSelect{grid-column:1/-1}.gallery{gap:12px}.postcard-photo{height:173px}.card-info{padding:12px}.country-title{font-size:20px}.meta{font-size:12px}.card-code{font-size:11px}.country-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.span2{grid-column:auto}.dialog-header{padding:16px}.dialog-body{padding:16px}.dialog-header h2{font-size:24px}.detail-photos{grid-template-columns:1fr 1fr}.detail-image{min-height:110px}.detail-image img,.detail-image .no-photo{height:150px}.detail-info{gap:10px}.btn{font-size:13px}
  }
  @media(max-width:440px){.gallery{grid-template-columns:1fr}.postcard-photo{height:220px}.brand-small{max-width:165px}.photo-grid{grid-template-columns:1fr}.detail-photos{grid-template-columns:1fr}.detail-image img,.detail-image .no-photo{height:220px}}
  @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
