* { margin: 0; padding: 0; box-sizing: border-box; }

    body {
      font-family: 'Poppins', sans-serif;
      background: #0b0e17;
      min-height: 100vh;
      color: #fff;
      overflow-x: hidden;
    }

    .bg-canvas { position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; }
    #confetti-canvas { position:fixed; top:0; left:0; width:100%; height:100%; z-index:100; pointer-events:none; }
    .main-wrap { position:relative; z-index:1; }

    h1 {
      text-align:center; padding:32px 20px 6px;
      font-family:'Fredoka',sans-serif; font-size:2.8rem; font-weight:700;
      background:linear-gradient(135deg,#ff6b6b,#ffa502,#ffdd59,#ffa502,#ff6b6b);
      background-size:300% 300%; -webkit-background-clip:text; -webkit-text-fill-color:transparent;
      animation:gradShift 4s ease infinite; filter:drop-shadow(0 0 30px rgba(255,165,2,0.3));
    }
    @keyframes gradShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
    .subtitle{text-align:center;color:#5a6a7a;font-size:0.9rem;margin-bottom:30px}

    .app-container{display:flex;gap:24px;max-width:1400px;margin:0 auto;padding:0 24px 50px;align-items:stretch;min-height:520px}

    .glass-card{
      background:linear-gradient(135deg,rgba(255,255,255,0.06),rgba(255,255,255,0.02));
      border-radius:24px;padding:28px;backdrop-filter:blur(20px);
      border:1px solid rgba(255,255,255,0.08);
      box-shadow:0 8px 32px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.05);
    }

    /* ======== LEFT PANEL ======== */
    .guest-panel{flex:1;min-width:0;display:flex;flex-direction:column}
    .guest-panel h2{font-family:'Fredoka',sans-serif;font-size:1.3rem;margin-bottom:20px;color:#ccd;display:flex;align-items:center;justify-content:space-between}
    .edit-slices-btn{
      font-size:0.7rem;padding:4px 12px;border-radius:8px;cursor:pointer;
      border:1px solid rgba(255,165,2,0.3);background:rgba(255,165,2,0.08);
      color:#ffa502;font-weight:600;transition:all 0.3s;font-family:'Poppins',sans-serif;
    }
    .edit-slices-btn:hover{background:rgba(255,165,2,0.18);transform:scale(1.05)}
    .edit-slices-btn.active{background:rgba(255,165,2,0.2);border-color:#ffa502}
    .slice-editor{
      display:none;gap:6px;align-items:center;position:relative;z-index:1;
    }
    .slice-editor.visible{display:flex}
    .slice-editor button{
      width:24px;height:24px;border-radius:6px;border:1px solid rgba(255,165,2,0.3);
      background:rgba(255,165,2,0.1);color:#ffa502;font-size:0.85rem;font-weight:700;
      cursor:pointer;display:flex;align-items:center;justify-content:center;
      transition:all 0.2s;padding:0;line-height:1;
    }
    .slice-editor button:hover{background:rgba(255,165,2,0.25);transform:scale(1.1)}
    .slice-editor .slice-val{
      font-size:0.85rem;font-weight:700;color:#ffa502;min-width:18px;text-align:center;
      font-family:'Fredoka',sans-serif;
    }

    .guest-type{
      display:flex;align-items:center;gap:14px;margin-bottom:14px;
      background:rgba(255,255,255,0.03);border-radius:14px;padding:14px 16px;
      transition:all 0.3s;border:1px solid transparent;position:relative;overflow:hidden;
    }
    .guest-type::before{
      content:'';position:absolute;inset:0;
      background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,165,2,0.08),transparent 60%);
      opacity:0;transition:opacity 0.3s;
    }
    .guest-type:hover::before{opacity:1}
    .guest-type:hover{border-color:rgba(255,165,2,0.15);transform:translateX(4px)}

    .guest-icon-btn{
      width:66px;height:66px;border-radius:16px;border:2px solid rgba(255,255,255,0.1);
      background:linear-gradient(135deg,rgba(255,255,255,0.05),rgba(255,255,255,0.01));
      cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:2.2rem;
      transition:all 0.3s cubic-bezier(0.34,1.56,0.64,1);user-select:none;flex-shrink:0;position:relative;z-index:1;
    }
    .guest-icon-btn:hover{border-color:#ffa502;background:rgba(255,165,2,0.12);transform:scale(1.12) rotate(-3deg);box-shadow:0 0 20px rgba(255,165,2,0.2)}
    .guest-icon-btn:active{transform:scale(0.92) rotate(2deg)}

    .guest-info{flex:1;position:relative;z-index:1}
    .guest-label{font-size:1rem;font-weight:600;margin-bottom:2px}
    .guest-slices{font-size:0.75rem;color:#6a7a8a}

    .guest-count-controls{display:flex;align-items:center;gap:8px;position:relative;z-index:1}

    .count-btn{
      width:38px;height:38px;border-radius:12px;border:none;font-size:1.3rem;font-weight:700;
      cursor:pointer;display:flex;align-items:center;justify-content:center;
      transition:all 0.2s cubic-bezier(0.34,1.56,0.64,1);
    }
    .count-btn.minus{background:rgba(255,107,107,0.15);color:#ff6b6b}
    .count-btn.minus:hover{background:rgba(255,107,107,0.3);transform:scale(1.15)}
    .count-btn.plus{background:rgba(46,213,115,0.15);color:#2ed573}
    .count-btn.plus:hover{background:rgba(46,213,115,0.3);transform:scale(1.15)}
    .count-btn:active{transform:scale(0.9)}

    .guest-count{
      font-family:'Fredoka',sans-serif;font-size:1.7rem;font-weight:700;
      width:48px;text-align:center;transition:all 0.3s;
      background:transparent;border:1px solid transparent;border-radius:8px;
      color:inherit;outline:none;padding:2px 0;-moz-appearance:textfield;
    }
    .guest-count:hover{border-color:rgba(255,165,2,0.25)}
    .guest-count:focus{border-color:#ffa502;background:rgba(255,165,2,0.08)}
    .guest-count::-webkit-inner-spin-button,
    .guest-count::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
    .guest-count.changed{animation:countPop 0.25s cubic-bezier(0.34,1.56,0.64,1)}
    @keyframes countPop{0%{transform:scale(1)}40%{transform:scale(1.5);color:#ffa502}100%{transform:scale(1)}}

    .people-parade{
      display:flex;flex-wrap:wrap;gap:5px;margin-top:16px;min-height:44px;padding:12px;flex:1;
      background:rgba(255,255,255,0.02);border-radius:14px;border:1px solid rgba(255,255,255,0.04);
      align-content:flex-start;
    }
    .people-parade .person{
      font-size:1.6rem;display:inline-block;
      animation:personEnter 0.3s cubic-bezier(0.34,1.56,0.64,1) both;
      cursor:default;transition:transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
    }
    .people-parade .person:hover{transform:scale(1.4) translateY(-4px)}
    .people-parade .person.wave{animation:wave 0.4s ease}

    @keyframes personEnter{
      0%{opacity:0;transform:scale(0) translateY(20px) rotate(-30deg)}
      60%{opacity:1;transform:scale(1.2) translateY(-5px) rotate(5deg)}
      100%{opacity:1;transform:scale(1) translateY(0) rotate(0)}
    }
    @keyframes wave{0%,100%{transform:rotate(0)}20%{transform:rotate(14deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(8deg)}80%{transform:rotate(-4deg)}}

    .total-guests{margin-top:12px;font-size:0.85rem;color:#5a6a7a;text-align:center}
    .total-guests span{color:#ffa502;font-weight:700;font-size:1.1rem}

    /* ======== MIDDLE PANEL (Slice Counter) ======== */
    .slice-panel{flex:1;min-width:0;text-align:center;display:flex;flex-direction:column}
    .slice-panel h2{font-family:'Fredoka',sans-serif;font-size:1.3rem;margin-bottom:14px;color:#ccd}
    #slice-result{flex:1;display:flex;flex-direction:column}
    .box-area{flex:1;display:flex;align-items:center;justify-content:center}

    /* ======== RIGHT PANEL (Order Total) ======== */
    .order-panel{flex:1;min-width:0;text-align:center;display:flex;flex-direction:column}
    .order-panel h2{font-family:'Fredoka',sans-serif;font-size:1.3rem;margin-bottom:14px;color:#ccd}
    #order-result{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center}

    .pizza-count-header{margin-bottom:18px}
    .pizza-count-num{
      font-family:'Fredoka',sans-serif;font-size:5rem;font-weight:700;line-height:1;
      background:linear-gradient(135deg,#ffa502,#ff6348);
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;
      display:inline-block;filter:drop-shadow(0 0 20px rgba(255,165,2,0.3));
    }
    .pizza-count-num.bump{animation:numBump 0.3s cubic-bezier(0.34,1.56,0.64,1)}
    @keyframes numBump{0%{transform:scale(1)}35%{transform:scale(1.35)}100%{transform:scale(1)}}
    .pizza-count-label{font-size:0.9rem;color:#6a7a8a;margin-bottom:4px}

    .order-empty{padding:30px 10px;color:#3a4a5a;font-size:0.9rem}
    .order-empty .big-box{font-size:3rem;opacity:0.25;margin-bottom:8px;animation:floatSpin 4s ease-in-out infinite}

    /* ---- Pile of closed boxes (white + red) ---- */
    .box-pile{
      display:flex;flex-wrap:wrap;justify-content:center;gap:8px;
      margin-bottom:16px;min-height:10px;perspective:500px;
    }
    .closed-box{
      width:58px;height:58px;border-radius:4px;position:relative;
      background:linear-gradient(160deg,#fff 0%,#f0ece6 60%,#e8e2d8 100%);
      border:2.5px solid #cc2a2a;
      box-shadow:0 3px 10px rgba(0,0,0,0.35),inset 0 1px 0 rgba(255,255,255,0.9);
      animation:boxLand 0.35s cubic-bezier(0.34,1.56,0.64,1) both;
      transition:transform 0.2s;
    }
    .closed-box:hover{transform:scale(1.15) rotate(-3deg) translateY(-4px)}

    /* Mini pizza emoji */
    .closed-box::after{
      content:'🍕';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
      font-size:1.5rem;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.15));
    }
    @keyframes boxLand{
      0%{opacity:0;transform:scale(0) translateY(-30px) rotateX(40deg)}
      60%{opacity:1;transform:scale(1.1) translateY(3px) rotateX(-5deg)}
      100%{opacity:1;transform:scale(1) translateY(0) rotateX(0)}
    }

    /* In-progress box (fills up as slices are added) */
    .progress-box{
      width:58px;height:58px;border-radius:4px;position:relative;
      border:2.5px solid rgba(204,42,42,0.4);
      box-shadow:0 3px 10px rgba(0,0,0,0.2);
      animation:boxLand 0.35s cubic-bezier(0.34,1.56,0.64,1) both;
      transition:transform 0.2s, background 0.4s ease;
      overflow:hidden;
    }
    .progress-box .fill-bar{
      position:absolute;bottom:0;left:0;right:0;
      background:linear-gradient(160deg,#fff 0%,#f0ece6 60%,#e8e2d8 100%);
      border-radius:0 0 2px 2px;
      transition:height 0.35s cubic-bezier(0.34,1.56,0.64,1);
    }
    .progress-box .fill-bg{
      position:absolute;inset:0;
      background:rgba(255,255,255,0.06);
    }
    .progress-box::after{
      content:'🍕';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
      font-size:1.5rem;z-index:1;
      transition:opacity 0.3s;
    }
    /* Red stripe shows when nearly full */
    .progress-box .fill-stripe{
      position:absolute;top:45%;left:0;right:0;height:4px;z-index:1;
      background:linear-gradient(90deg,transparent 5%,#cc2a2a 5%,#cc2a2a 95%,transparent 95%);
      opacity:0;transition:opacity 0.3s;
    }

    /* ---- Open pizza box (white + red) ---- */
    .open-box-scene{
      perspective:800px;margin:0 auto 14px;width:230px;height:270px;position:relative;
    }

    .open-box{
      position:relative;width:210px;height:210px;margin:50px auto 0;
      transform-style:preserve-3d;transform:rotateX(20deg);
    }

    .box-base{
      width:100%;height:100%;
      background:linear-gradient(160deg,#fff 0%,#f5f1eb 40%,#ece6dc 100%);
      border-radius:5px;position:relative;
      border:3px solid #cc2a2a;
      box-shadow:0 6px 24px rgba(0,0,0,0.45),inset 0 0 0 1px rgba(255,255,255,0.5);
    }

    .box-inner{
      position:absolute;inset:8px;
      background:linear-gradient(145deg,#faf6f0,#f0ebe2);
      border-radius:3px;
      box-shadow:inset 0 2px 10px rgba(0,0,0,0.1);
      border:1px solid rgba(0,0,0,0.06);
    }

    /* Grease stain effect */
    .box-inner::after{
      content:'';position:absolute;
      width:60%;height:60%;top:20%;left:20%;border-radius:50%;
      background:radial-gradient(ellipse,rgba(200,180,140,0.15) 0%,transparent 70%);
    }

    .box-lid{
      position:absolute;width:100%;height:100%;top:0;left:0;
      background:linear-gradient(160deg,#fff 0%,#f5f1eb 40%,#ece6dc 100%);
      border-radius:5px;
      border:3px solid #cc2a2a;
      transform-origin:top center;
      transform:rotateX(-105deg);
      transition:transform 0.5s cubic-bezier(0.4,0,0.2,1);
      box-shadow:0 2px 12px rgba(0,0,0,0.25);
      z-index:2;
      overflow:hidden;
    }

    /* Red border stripe on lid */
    .box-lid::before{
      content:'';position:absolute;inset:6px;
      border:2px solid rgba(204,42,42,0.35);border-radius:3px;
    }
    /* "PIZZA" text on lid */
    .box-lid::after{
      content:'PIZZA';position:absolute;top:50%;left:50%;
      transform:translate(-50%,-50%);
      font-family:'Fredoka',sans-serif;font-size:1.1rem;font-weight:700;
      color:rgba(204,42,42,0.4);letter-spacing:3px;
    }

    .box-lid.closing{transform:rotateX(-2deg)}

    /* ---- Pizza canvas inside box ---- */
    .pizza-canvas-wrap{
      position:absolute;
      width:168px;height:168px;
      top:50%;left:50%;
      transform:translate(-50%,-50%);
      border-radius:50%;
      overflow:hidden;
    }

    .pizza-canvas-wrap canvas{
      width:100%;height:100%;
      border-radius:50%;
    }


    /* ---- Breakdown ---- */
    .slice-breakdown{
      background:rgba(255,255,255,0.03);border-radius:12px;padding:10px 14px;
      border:1px solid rgba(255,255,255,0.04);text-align:left;
    }
    .slice-breakdown .row{display:flex;justify-content:space-between;padding:3px 0;font-size:0.78rem;color:#6a7a8a}
    .slice-breakdown .row span:last-child{color:#ccc;font-weight:600;font-family:'Fredoka',sans-serif}
    .slice-breakdown .divider{border:none;border-top:1px solid rgba(255,255,255,0.05);margin:5px 0}
    .slice-breakdown .total-row{color:#ffa502;font-weight:600}
    .slice-breakdown .total-row span:last-child{color:#ffa502}

    .reset-btn{
      margin-top:0;padding:12px 96px;border:1px solid rgba(255,107,107,0.3);border-radius:12px;
      background:rgba(255,107,107,0.08);color:#ff6b6b;font-size:0.9rem;font-weight:600;
      cursor:pointer;transition:all 0.3s;width:100%;max-width:600px;font-size:1.1rem;
    }
    .reset-btn:hover{background:rgba(255,107,107,0.2);transform:scale(1.03)}

    .empty-state{padding:20px;color:#3a4a5a;font-size:0.95rem;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}
    .empty-pizza-main{font-size:4rem;animation:floatSpin 4s ease-in-out infinite;opacity:0.3;margin-bottom:10px}
    @keyframes floatSpin{0%,100%{transform:translateY(0) rotate(0)}33%{transform:translateY(-14px) rotate(5deg)}66%{transform:translateY(-6px) rotate(-3deg)}}

    .open-box.box-fade-out{animation:boxFadeOut 0.2s ease forwards}
    @keyframes boxFadeOut{to{opacity:0;transform:rotateX(20deg) scale(0.8)}}

    /* Flying box */
    .flying-box{
      position:fixed;z-index:90;pointer-events:none;
      width:62px;height:62px;border-radius:5px;
      background:linear-gradient(160deg,#fff,#f0ece6,#e8e2d8);
      border:2.5px solid #cc2a2a;
      box-shadow:0 6px 24px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.9);
      display:flex;align-items:center;justify-content:center;font-size:1.5rem;
    }
    .flying-box::after{
      content:'🍕';
    }

    .order-panel.glow{animation:panelGlow 0.5s ease-out}
    @keyframes panelGlow{0%{box-shadow:0 8px 32px rgba(0,0,0,0.3)}50%{box-shadow:0 8px 32px rgba(0,0,0,0.3),0 0 60px rgba(255,165,2,0.25)}100%{box-shadow:0 8px 32px rgba(0,0,0,0.3)}}

    .particle{position:fixed;pointer-events:none;z-index:50;font-size:1.2rem;animation:particleBurst 0.5s cubic-bezier(0,0.7,0.3,1) forwards}
    @keyframes particleBurst{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--tx),var(--ty)) scale(0)}}

    /* ---- Tablet ---- */
    @media(max-width:1000px){
      .app-container{flex-wrap:wrap;gap:16px}
      .guest-panel{flex:1 1 100%}
      .slice-panel,.order-panel{flex:1 1 45%;position:static}
    }

    /* ---- Mobile ---- */
    @media(max-width:650px){
      .app-container{flex-direction:column;gap:14px;padding:0 12px 30px}
      .glass-card{padding:18px 14px;border-radius:18px}
      .slice-panel,.order-panel,.guest-panel{position:static;flex:none;width:100%}

      h1{font-size:1.8rem;padding:20px 12px 4px}
      .subtitle{font-size:0.8rem;margin-bottom:18px}

      /* Guest panel compact */
      .guest-panel h2{font-size:1.1rem;margin-bottom:14px}
      .guest-type{padding:10px 12px;gap:10px;margin-bottom:10px}
      .guest-icon-btn{width:52px;height:52px;font-size:1.8rem;border-radius:12px}
      .guest-label{font-size:0.9rem}
      .guest-slices{font-size:0.7rem}
      .count-btn{width:36px;height:36px;font-size:1.1rem;border-radius:10px}
      .guest-count{font-size:1.4rem;min-width:32px}
      .people-parade{padding:10px;gap:4px;min-height:36px}
      .people-parade .person{font-size:1.3rem}
      .total-guests{font-size:0.8rem;margin-top:8px}

      /* Slice panel compact */
      .slice-panel h2{font-size:1.1rem;margin-bottom:10px}
      .slice-panel h2 svg{width:20px;height:20px}
      .open-box-scene{width:180px;height:220px;margin:0 auto 10px}
      .open-box{width:170px;height:170px;margin:40px auto 0}
      .pizza-canvas-wrap{width:138px;height:138px}
      .slice-breakdown{padding:8px 10px}
      .slice-breakdown .row{font-size:0.72rem;padding:2px 0}
      .slice-breakdown .row span:last-child{font-size:0.82rem}

      /* Order panel compact */
      .order-panel h2{font-size:1.1rem;margin-bottom:10px}
      .pizza-count-num{font-size:3.75rem}
      .pizza-count-label{font-size:0.8rem}
      .pizza-count-header{margin-bottom:12px}
      .box-pile{gap:6px;margin-bottom:12px}
      .closed-box,.progress-box{width:48px;height:48px}
      .closed-box::after,.progress-box::after{font-size:1.2rem}
    }

    /* ---- Small mobile ---- */
    @media(max-width:380px){
      h1{font-size:1.5rem}
      .glass-card{padding:14px 10px}
      .guest-icon-btn{width:44px;height:44px;font-size:1.5rem}
      .open-box-scene{width:160px;height:200px}
      .open-box{width:150px;height:150px;margin:35px auto 0}
      .pizza-canvas-wrap{width:120px;height:120px}
      .pizza-count-num{font-size:3.1rem}
      .closed-box,.progress-box{width:42px;height:42px}
      .closed-box::after,.progress-box::after{font-size:1rem}
    }

    /* ======== PIZZA GUIDE SECTION ======== */
    #pizza-guide{
      max-width:820px;margin:0 auto;padding:50px 24px 60px;margin-top:120px;
    }

    .guide-card{
      background:linear-gradient(135deg,rgba(255,255,255,0.05),rgba(255,255,255,0.02));
      border-radius:24px;padding:40px 36px;backdrop-filter:blur(20px);
      border:1px solid rgba(255,255,255,0.08);
      box-shadow:0 8px 32px rgba(0,0,0,0.3);
    }

    #pizza-guide h2{
      font-family:'Fredoka',sans-serif;font-size:1.8rem;font-weight:700;
      margin-bottom:24px;
      background:linear-gradient(135deg,#ffa502,#ff6348);
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;
    }

    #pizza-guide h3{
      font-family:'Fredoka',sans-serif;font-size:1.2rem;font-weight:600;
      color:#ddd;margin:28px 0 12px;
    }

    #pizza-guide p{
      font-family:'Poppins',sans-serif;font-size:0.92rem;line-height:1.75;
      color:#8a9aaa;margin-bottom:16px;
    }

    #pizza-guide strong{color:#ccd}

    /* Guide table */
    .guide-table{
      width:100%;border-collapse:collapse;margin:16px 0 28px;
      font-family:'Poppins',sans-serif;font-size:0.88rem;
    }

    .guide-table thead th{
      font-family:'Fredoka',sans-serif;font-weight:600;font-size:0.9rem;
      color:#ffa502;text-align:left;padding:10px 16px;
      border-bottom:2px solid rgba(255,165,2,0.2);
    }

    .guide-table tbody td{
      color:#8a9aaa;padding:10px 16px;
      border-bottom:1px solid rgba(255,255,255,0.04);
    }

    .guide-table tbody tr:hover td{
      color:#ccd;background:rgba(255,255,255,0.02);
    }

    .guide-table tbody td:last-child{
      color:#ddd;font-weight:600;
    }

    /* FAQ details */
    #pizza-guide details{
      margin-bottom:10px;
      border:1px solid rgba(255,255,255,0.06);
      border-radius:12px;
      overflow:hidden;
      transition:all 0.3s;
    }

    #pizza-guide details[open]{
      border-color:rgba(255,165,2,0.15);
      background:rgba(255,255,255,0.02);
    }

    #pizza-guide summary{
      font-family:'Fredoka',sans-serif;font-size:1rem;font-weight:600;
      color:#ccd;padding:14px 18px;cursor:pointer;
      list-style:none;display:flex;align-items:center;gap:10px;
      transition:color 0.2s;
    }

    #pizza-guide summary:hover{color:#ffa502}

    #pizza-guide summary::before{
      content:'🍕';font-size:1.1rem;flex-shrink:0;
    }

    #pizza-guide summary::after{
      content:'+';margin-left:auto;font-size:1.2rem;
      color:#5a6a7a;transition:transform 0.3s;
    }

    #pizza-guide details[open] summary::after{
      content:'−';transform:rotate(180deg);color:#ffa502;
    }

    #pizza-guide details p{
      padding:0 18px 14px;margin:0;font-size:0.88rem;
    }

    /* Guide responsive */
    @media(max-width:650px){
      #pizza-guide{padding:30px 12px 40px}
      .guide-card{padding:24px 18px;border-radius:18px}
      #pizza-guide h2{font-size:1.4rem}
      #pizza-guide h3{font-size:1.05rem}
      #pizza-guide p{font-size:0.85rem}
      .guide-table{font-size:0.82rem}
      .guide-table thead th,.guide-table tbody td{padding:8px 12px}
      #pizza-guide summary{font-size:0.9rem;padding:12px 14px}
      #pizza-guide details p{padding:0 14px 12px;font-size:0.82rem}
    }