/* Generated by php scripts/build-css-tokens.php; edit the token source files. */
:root {

  --c-ink-black:   #0F0F0F;
  --c-white:       #FFFFFF;
  --c-paper:       #FAFAF7;

  --c-gray-50:     #F5F5F5;
  --c-gray-100:    #ECECEC;
  --c-gray-200:    #DCDCDC;
  --c-gray-300:    #C4C4C4;
  --c-gray-400:    #9E9E9E;
  --c-gray-500:    #7A7A7A;
  --c-gray-600:    #5C5C5C;
  --c-gray-700:    #404040;
  --c-gray-800:    #262626;
  --c-gray-900:    #171717;


  --c-holo-pink:     #FFC4DD;
  --c-holo-sky:      #C4DFF8;
  --c-holo-cream:    #FFF7C4;
  --c-holo-mint:     #C4F5D9;
  --c-holo-lavender: #DCC4F5;
  --c-holo-peach:    #FFD4C4;


  --c-brand-violet: #6C4AE0;


  --c-rarity-500: #E34948;
  --c-rgb-green: #2E9E4F;
  --c-rgb-blue:  #1E6FE0;
  --c-rarity-400: #EE9A99;
  --c-rarity-300: #F3BDBC;
  --c-rarity-200: #F7D8D7;
  --c-rarity-100: #FAEAE9;


  --c-holo-gradient: linear-gradient(
    135deg,
    #FFC4DD 0%,
    #C4DFF8 20%,
    #FFF7C4 40%,
    #C4F5D9 60%,
    #DCC4F5 80%,
    #FFD4C4 100%
  );


  --c-scrim-gradient: linear-gradient(
    to top,
    rgba(15, 15, 15, 0.92) 0%,
    rgba(15, 15, 15, 0.55) 40%,
    rgba(15, 15, 15, 0) 72%
  );


  --c-scrim-flat: rgba(15, 15, 15, 0.55);


  --c-poll-red:  #D9534F;
  --c-poll-blue: #0275D8;


  --c-positive-50:  #E6F4EB;
  --c-positive-300: #6ECF95;
  --c-positive-500: #2D8F4E;
  --c-positive-700: #1F6B36;

  --c-warning-50:   #FEF3C7;
  --c-warning-300:  #FCD34D;
  --c-warning-500:  #C58A00;
  --c-warning-700:  #92400E;

  --c-danger-50:    #FDE8E8;
  --c-danger-300:   #FCA5A5;
  --c-danger-500:   #C0392B;
  --c-danger-700:   #991B1B;

  --c-info-50:      #EEF4FF;
  --c-info-300:     #C8D8F3;
  --c-info-500:     #1E3A8A;
  --c-info-700:     #172554;
  --c-link-blue:    #1558D6;
  --c-link-blue-700: #0F42A6;
  --c-link-blue-800: #0A2F78;
  --c-link-google:  #1a0dab;


  --c-gold-500:    #F59E0B;


  --c-vote-red:    #D3574F;
  --c-vote-blue:   #0869C4;
  --c-gold-300:    #FCD34D;


  --c-sns-x:        #0F1419;
  --c-sns-line:     #06C755;
  --c-sns-line-600: #05A648;
  --c-sns-line-800: #047A36;
  --c-sns-facebook: #0866FF;


  --c-orange-500:  #F97316;
  --c-orange-600:  #EA580C;
  --c-orange-700:  #C2410C;


  --c-sand-200:    #F3EBD8;


  --c-cta-red: #EA0000;
  --c-cta-red-hover: #B40000;
  --c-cta-red-depth: #8A0000;
  --c-cta-red-gloss: rgba(255, 255, 255, 0.22);


  --font-sans: "Noto Sans JP", "Helvetica Neue", -apple-system, BlinkMacSystemFont,
               "Hiragino Sans", "Hiragino Kaku Gothic ProN",
               "Yu Gothic Medium", "Yu Gothic", "Meiryo", sans-serif;

  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-15: 15px;
  --fs-16: 16px;
  --fs-17: 17px;
  --fs-18: 18px;
  --fs-19: 19px;
  --fs-20: 20px;
  --fs-21: 21px;
  --fs-22: 22px;
  --fs-24: 24px;
  --fs-26: 26px;
  --fs-32: 32px;
  --fs-40: 40px;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-bold:    700;

  --lh-tight:  1.3;
  --lh-normal: 1.6;
  --lh-loose:  1.8;


  --space-0:   0;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;
  --space-16:  64px;
  --space-20:  80px;
  --space-24:  96px;


  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-pill: 9999px;


  --border-width-1:     1px;
  --border-width-2:     2px;
  --border-width-thick: 6px;


  --touch-target-min:   44px;


  --shadow-1: 0 1px 2px rgba(15, 15, 15, 0.04);
  --shadow-2: 0 2px 8px rgba(15, 15, 15, 0.06);
  --shadow-3: 0 8px 24px rgba(15, 15, 15, 0.08);


  --container-narrow: 720px;
  --container-base:   960px;
  --container-wide:  1200px;
  --container-chat:  520px;
  --container-float-sindan: 208px;


  --bp-sm: 640px;
  --bp-md: 768px;
  --bp-lg: 1024px;
}
:root {

  --ds-color-sindan-stage: var(--c-paper);
  --ds-color-sindan-chat-canvas: var(--c-info-300);
  --ds-container-chat: var(--container-chat);
  --ds-container-float-sindan: var(--container-float-sindan);
  --ds-ease-sindan-enter: cubic-bezier(.165, .84, .44, 1);
  --ds-duration-sindan-enter: 500ms;
  --ds-duration-sindan-result: 650ms;
  --ds-duration-sindan-modal: 320ms;
  --ds-duration-sindan-modal-leave: 180ms;
  --ds-delay-sindan-modal-content: 90ms;

  --ds-color-bg:           var(--c-white);
  --ds-color-bg-paper:     var(--c-paper);
  --ds-color-bg-elevated:  var(--c-white);
  --ds-color-bg-inverse:   var(--c-ink-black);
  --ds-color-bg-subtle:    var(--c-gray-50);
  --ds-color-bg-canvas:    var(--c-gray-100);


  --ds-color-text:          var(--c-ink-black);
  --ds-color-text-muted:    var(--c-gray-600);
  --ds-color-text-subtle:   var(--c-gray-500);
  --ds-color-text-disabled: var(--c-gray-400);
  --ds-color-text-inverse:  var(--c-white);
  --ds-color-text-link:     var(--c-ink-black);
  --ds-color-text-link-accent: var(--c-link-google);
  --ds-color-link:          var(--c-link-blue);


  --ds-color-border:         var(--c-gray-200);
  --ds-color-border-strong:  var(--c-gray-300);
  --ds-color-border-inverse: var(--c-gray-800);


  --ds-color-accent-gradient: var(--c-holo-gradient);
  --ds-color-scrim-gradient:  var(--c-scrim-gradient);
  --ds-color-scrim-modal:     var(--c-scrim-flat);
  --ds-color-accent-brand:    var(--c-brand-violet);
  --ds-color-accent-pink:     var(--c-holo-pink);
  --ds-color-accent-sky:      var(--c-holo-sky);
  --ds-color-accent-cream:    var(--c-holo-cream);
  --ds-color-accent-mint:     var(--c-holo-mint);
  --ds-color-accent-lavender: var(--c-holo-lavender);
  --ds-color-accent-peach:    var(--c-holo-peach);


  --ds-color-rarity-fur: var(--c-rarity-500);

  --ds-color-rgb-red:   var(--c-rarity-500);
  --ds-color-rgb-green: var(--c-rgb-green);
  --ds-color-rgb-blue:  var(--c-rgb-blue);
  --ds-color-rarity-sar: var(--c-rarity-400);
  --ds-color-rarity-sr:  var(--c-rarity-300);
  --ds-color-rarity-ar:  var(--c-rarity-200);
  --ds-color-rarity-rr:  var(--c-rarity-100);


  --ds-color-positive: var(--c-positive-500);
  --ds-color-warning:  var(--c-warning-500);
  --ds-color-danger:   var(--c-danger-500);


  --ds-color-poll-a: var(--c-poll-red);
  --ds-color-poll-b: var(--c-poll-blue);


  --ds-color-state-positive-bg:     var(--c-positive-50);
  --ds-color-state-positive-border: var(--c-positive-300);
  --ds-color-state-positive-text:   var(--c-positive-700);
  --ds-color-state-warning-bg:      var(--c-warning-50);
  --ds-color-state-warning-border:  var(--c-warning-300);
  --ds-color-state-warning-text:    var(--c-warning-700);
  --ds-color-state-danger-bg:       var(--c-danger-50);
  --ds-color-state-danger-border:   var(--c-danger-300);
  --ds-color-state-danger-text:     var(--c-danger-700);
  --ds-color-state-info-bg:         var(--c-info-50);
  --ds-color-state-info-border:     var(--c-info-300);
  --ds-color-state-info-text:       var(--c-info-700);


  --ds-color-faq-q-bg:  var(--c-link-blue);
  --ds-color-faq-a-bg:  var(--c-danger-500);


  --ds-color-sns-x:        var(--c-sns-x);
  --ds-color-sns-line:     var(--c-sns-line);
  --ds-color-sns-facebook: var(--c-sns-facebook);


  --ds-color-rating:        var(--c-gold-500);
  --ds-color-rating-empty:  var(--c-gray-300);
  --ds-color-accent-gold:   var(--c-gold-500);
  --ds-color-vote-positive: var(--c-vote-red);
  --ds-color-vote-negative: var(--c-vote-blue);


  --ds-color-cta-red-bg: var(--c-cta-red);
  --ds-color-cta-red-hover: var(--c-cta-red-hover);
  --ds-color-cta-red-depth: var(--c-cta-red-depth);
  --ds-color-cta-red-gloss: var(--c-cta-red-gloss);
  --ds-color-cta-bg:        var(--c-orange-500);
  --ds-color-cta-bg-hover:  var(--c-orange-600);
  --ds-color-cta-blue-bg:       var(--c-link-blue);
  --ds-color-cta-blue-bg-hover: var(--c-link-blue-700);
  --ds-color-cta-depth:         var(--c-gray-900);
  --ds-color-cta-orange-depth:  var(--c-orange-700);
  --ds-color-cta-blue-depth:    var(--c-link-blue-800);
  --ds-color-cta-line-bg:       var(--c-sns-line);
  --ds-color-cta-line-bg-hover: var(--c-sns-line-600);
  --ds-color-cta-line-depth:    var(--c-sns-line-800);


  --ds-color-heading-band-bg:       var(--c-orange-500);
  --ds-color-heading-band-text:     var(--c-white);
  --ds-color-heading-band-underlay: var(--c-sand-200);
  --ds-color-heading-accent:        var(--c-orange-500);
  --ds-space-heading-band-y:        var(--space-3);
  --ds-space-heading-band-x:        var(--space-4);
  --ds-size-heading-underlay:       var(--space-2);
  --ds-size-heading-accent:         var(--space-3);
  --ds-border-width-heading-accent: var(--border-width-2);


  --ds-color-table-kv-head-bg:   var(--c-gray-50);
  --ds-color-table-kv-head-text: var(--ds-color-text);

  --ds-space-table-cell-y:       var(--space-4);


  --ds-color-badge-bg-mint:     var(--c-holo-mint);
  --ds-color-badge-bg-peach:    var(--c-holo-peach);
  --ds-color-badge-bg-cream:    var(--c-holo-cream);
  --ds-color-badge-bg-sky:      var(--c-holo-sky);
  --ds-color-badge-bg-pink:     var(--c-holo-pink);
  --ds-color-badge-bg-lavender: var(--c-holo-lavender);
  --ds-color-badge-text:        var(--c-ink-black);



  --ds-font-body: var(--font-sans);

  --ds-text-display-size:   var(--fs-40);
  --ds-text-display-lh:     var(--lh-tight);
  --ds-text-display-weight: var(--fw-bold);

  --ds-text-h1-size:   var(--fs-32);
  --ds-text-h1-lh:     var(--lh-tight);
  --ds-text-h1-weight: var(--fw-bold);

  --ds-text-h2-size:   var(--fs-26);
  --ds-text-h2-lh:     var(--lh-tight);
  --ds-text-h2-weight: var(--fw-bold);

  --ds-text-h3-size:   var(--fs-20);
  --ds-text-h3-lh:     var(--lh-normal);
  --ds-text-h3-weight: var(--fw-bold);

  --ds-text-body-size:   var(--fs-16);
  --ds-text-body-lh:     var(--lh-loose);
  --ds-text-body-weight: var(--fw-regular);

  --ds-text-body-sm-size:   var(--fs-14);
  --ds-text-body-sm-lh:     var(--lh-normal);
  --ds-text-body-sm-weight: var(--fw-regular);

  --ds-text-caption-size:   var(--fs-13);
  --ds-text-caption-lh:     var(--lh-normal);
  --ds-text-caption-weight: var(--fw-regular);

  --ds-text-micro-size:   var(--fs-12);
  --ds-text-micro-lh:     var(--lh-tight);
  --ds-text-micro-weight: var(--fw-medium);


  --ds-space-stack-xs: var(--space-2);
  --ds-space-stack-sm: var(--space-4);
  --ds-space-stack-heading: var(--space-5);
  --ds-space-stack-md: var(--space-6);
  --ds-space-stack-lg: var(--space-12);
  --ds-space-stack-xl: var(--space-20);
  --ds-space-stack-1_5line-sp: var(--space-12);

  --ds-space-inline-xs: var(--space-1);
  --ds-space-inline-sm: var(--space-2);
  --ds-space-inline-md: var(--space-4);

  --ds-space-page-x:    var(--space-4);
  --ds-space-page-x-md: var(--space-8);


  --ds-radius-card:   var(--radius-md);
  --ds-radius-lg:     var(--radius-lg);
  --ds-radius-input:  var(--radius-sm);
  --ds-radius-button: var(--radius-sm);
  --ds-radius-chip:   var(--radius-pill);
  --ds-radius-avatar: var(--radius-pill);


  --ds-border-width:        var(--border-width-1);
  --ds-border-width-divider: var(--border-width-thick);


  --ds-touch-target-min:    var(--touch-target-min);


  --ds-shadow-card:    var(--shadow-1);
  --ds-shadow-popover: var(--shadow-2);
  --ds-shadow-modal:   var(--shadow-3);


  --ds-container-article: var(--container-narrow);
  --ds-container-page:    var(--container-base);
  --ds-container-wide:    var(--container-wide);
}